Как изменить цвет выбранных элементов в пользовательской серии

Взяв задокументированный пример для рендеринга прямоугольных элементов, как я могу изменить цвет при выборе элемента?

Первый шаг — это, конечно, добавить selectedMode: "single", но тогда я застрял.

Я попробовал добавить это:

select: {
  itemStyle: {
    color: "#4338ca",
  },
},
emphasis: {
  itemStyle: {
    color: "#be123c",
  },
},

но, похоже, это не учитывается (см. модифицированный пример ).

Бонусный вопрос: метод api.style() помечен как устаревший, когда я использую его в VS Code или онлайн-редакторе, но в документации пользователя о таком устаревшем не упоминается?

bar-chart echarts

12.06.2024 00:32

Стоит ли изучать PHP в 2023-2024 годах?

Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Приемы CSS-макетирования - floats и Flexbox

Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...

Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest

В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Пользовательский скаляр GraphQL

Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вам необходимо определить поведение для select и выделения внутри функции renderItem.

Пример :

renderItem: function (params, api) {

    ...

    return {
        type: 'rect',
        shape: { ... },
        style: { ... },
        select: {
            style: { fill: '#4338ca' }
        },
        emphasis: {
            style: { fill: '#be123c' }
        }
    };
}

Документация ведется не идеально, часто информация отсутствует или не совсем верна.

Спасибо!! 🙏 Я пробовал что-то подобное, но настроил select.itemStyle.color вместо select.style.fill (это имеет смысл теперь, когда я думаю об этом, поскольку здесь мы дошли до уровня спецификации SVG).

— 12.06.2024 10:26

12.06.2024 08:02