Highcharts меняют маркер динамически и индивидуально

Я использую Highcharts, и я хотел бы знать, как я могу изменить настройку нескольких маркеров (например, symbol, lineWidth, lineColor а также fillColor) определенного количества значений в зависимости от того, превышает ли он (или нет) пороговое значение.

Например: http://jsfiddle.net/danielmorim/sxgL6/19/

Я хочу изменить все настройки этого маркера для всех температурных данных больше 20°C и меньше 10°C.

2 ответа

Вы можете изменить lineCOlor / lineWidth путем доступа к графическому объекту и изменить его с помощью функции attr().

chart.series[0].graph.attr('stroke', 'red');
chart.series[0].graph.attr('stroke-width', 10);

Следующая документация. Вы можете иметь свою серию: serie = [1, 2, 4, 5, 6, 7, 8];

Кроме того, вы можете иметь объекты вместо чисел. Эти объекты могут иметь несколько свойств, таких как: fillColor, radius, symbol,

Таким образом, вы можете изменить конкретный элемент в серии с помощью чего-то вроде:

serie[i] =  {
  y: serie1[i],         // This is the number 
  marker: {
    fillColor: 'red',
    radius: 5,
    symbol: 'url(https://www.highcharts.com/samples/graphics/snow.png)'
  }
}

Вы можете найти документацию здесь: https://api.highcharts.com/highcharts/plotOptions.series.marker https://www.highcharts.com/demo/spline-symbols

Другие вопросы по тегам