freeCodeCamp/curriculum/challenges/russian/04-data-visualization/data-visualization-with-d3/use-the-d3.max-and-d3.min-f...

4.0 KiB
Raw Blame History

id title challengeType forumTopicId localeTitle
587d7fac367417b2b2512bdc Use the d3.max and d3.min Functions to Find Minimum and Maximum Values in a Dataset 6 301496 Используйте функции d3.max и d3.min для поиска минимальных и максимальных значений в наборе данных

Description

D3 method domain() и range() устанавливают эту информацию для вашего масштаба на основе данных. Есть несколько способов сделать это проще. Часто, когда вы устанавливаете домен, вы хотите использовать минимальное и максимальное значения в наборе данных. Попытка найти эти значения вручную, особенно в большом наборе данных, может привести к ошибкам. D3 имеет два метода - min() и max() чтобы вернуть эту информацию. Вот пример:
const exampleData = [34, 234, 73, 90, 6, 52];
d3.min (exampleData) // Возвращает 6
d3.max (exampleData) // Возвращает 234
Набор данных может иметь вложенные массивы, такие как пары координат [x, y], которые были в примере графика рассеяния. В этом случае вам нужно рассказать D3, как рассчитать максимум и минимум. К счастью, методы min() и max() принимают функцию обратного вызова. В этом примере аргумент функции обратного вызова d для текущего внутреннего массива. Обратный вызов должен возвращать элемент из внутреннего массива (значение x или y), по которому вы хотите вычислить максимальное или минимальное значение. Ниже приведен пример того, как найти значения min и max с массивом массивов:
const locationData = 1, 7], [6, 3], [8, 3;
// Возвращает наименьшее число из первых элементов
const minX = d3.min (locationData, (d) => d [0]);
// minX сравнивается с 1, 6 и 8 и устанавливается в 1

Instructions

Переменная positionData содержит трехмерный (3D) массив. Используйте метод D3, чтобы найти максимальное значение координаты z (третье значение) из массивов и сохранить его в output переменной. Заметка
Интересный факт - D3 может отображать 3D-массивы.

Tests

tests:
  - text: The text in the <code>h2</code> should be 8.
    testString: assert(output == 8 && $('h2').text() == '8');
  - text: Your code should use the <code>max()</code> method.
    testString: assert(code.match(/\.max/g), 'Your code should use the <code>max()</code> method.')

Challenge Seed

<body>
  <script>
    const positionData = [[1, 7, -4],[6, 3, 8],[2, 9, 3]]
    // Add your code below this line

    const output = undefined; // Change this line

    // Add your code above this line

    d3.select("body")
      .append("h2")
      .text(output)
  </script>
</body>

Solution

// solution required