Vue и apexcharts, как показать только несколько маркеров? - PullRequest
0 голосов
/ 28 октября 2019

У меня есть график, выполненный в vue.JS с использованием apexcharts https://apexcharts.com/docs/options/markers/, и я не хочу показывать маркеры (размер = 0), но только на пиках фей, показывающих значки настройки.

Какпоказывать только несколько маркеров и не на всех данных?

У меня есть две серии:

 series: [
                {
                    name: 'TEST A',
                    data: [0,22,33,44,55,66]
                },
                {
                    name: 'TEST B',
                    data: [0,22,11,46,90,55]
                }],

и ось как

xaxis: {
  categories: ["0","10", "20", "30", "40", "50", "60", "70", "80", "90", "100"]
},

Мой вопрос, как я могу показатьмаркер только для категорий "30" и "40"?

что-то вроде маркеров = [0,0,0,1,1,0,0,0,0] или лучше: маркеры = [0,0,0,1,2,0,0,0,0] с иконкой-маркером в 1 и другим значком в 2.

Правка.

Решениенаходится в

дискретный : Массив Позволяет по-разному нацеливать отдельные точки данных и стиль для конкретного маркера

Так что это работает:

 markers: {
                    size: 1,
                    colors: undefined,
                    strokeColors: '#FFF',
                    strokeWidth: 2,
                    strokeOpacity: 0.9,
                    fillOpacity: 1,
                    shape: "circle",
                    discrete: [{
                        seriesIndex: 0,
                        dataPointIndex: 0,
                        fillColor: '#f7f4f3',
                        strokeColor: '#6a727a',
                        size: 10
                    },{
                        seriesIndex: 1,
                        dataPointIndex: 2,
                        fillColor: '#f7f4f3',
                        strokeColor: '#6a727a',
                        size: 10
                    }],
                    radius: 2,
                    offsetX: 0,
                    offsetY: 0,
                    onClick: undefined,
                    onDblClick: undefined,
                    hover: {
                        size: undefined,
                        sizeOffset: 3
                    }
                },

Но я не могу динамически обновлять chartOptions.markers.discrete . Вы можете мне помочь?

...