Изменение стилей на основе данных
D3 - о визуализации и представлении данных. Вероятно, вы захотите изменить стиль элементов на основе данных. Вы можете использовать функцию обратного вызова в методе style()
для изменения стиля для разных элементов. Например, вы можете покрасить синюю точку данных, если она имеет значение менее 20, и наоборот. Вы можете использовать функцию обратного вызова в методе style()
и включать условную логику. Функция обратного вызова использует параметр d
для представления точки данных:
selection.style ("color", (d) => {Метод
/ * Логика, возвращающая цвет, основанный на условии * /
});
style()
не ограничивается настройкой color
- его можно использовать и с другими свойствами CSS.Add the style()
method to the code in the editor to set the color
of the h2
elements conditionally. Write the callback function so if the data value is less than 20, it returns "red", otherwise it returns "green".
Note
You can use if-else logic, or the ternary operator.