HighCharts: динамически изменяет маркеры диаграммы рассеяния

Question

Я использую HighCharts версии 4.0.4. У меня есть диаграмма рассеяния, которая имеет процентные значения для ширины и высоты. Таким образом, график автоматически изменяется, если размер контейнера/окна изменился.

Единственное, что не меняется по размеру, это радиус маркеров, потому что кажется, что я могу определить число, см. Здесь plotOptions.scatter.marker.radius.

Вот JSFiddle here с исправлением radius из 10.

$(function() { 
    $('#container').highcharts({ 
     chart: { 
      type: 'scatter', 
      zoomType: 'xy' 
     }, 
     plotOptions: { 
      scatter: { 
       marker: { 
        radius: 10 
       } 
      } 
     } 
     /*, ... */ 
    }); 
}); 

Изменение размера контейнера/окна, размер маркера всегда одинаков. Но моя веб-страница использует проценты или значения rem, и я также хочу изменить размер всех маркеров графика. Как это может быть сделано?

Answer 1

Поскольку номер radius принимает только номер, вы можете подключить обработчик к window.resize (например) и использовать его для увеличения или уменьшения радиуса маркера в зависимости от того, была ли ширина увеличена или уменьшена (вы можете изменить радиус маркера программно путем передачи объекта с новым радиусом в метод update для каждой серии).

Я не знаю, если это путь, который вы хотите принять или нет, но я обновил ваш Fiddle с помощью простого примера, показывающего именно это. В нем я увеличиваю радиус маркера на 1, если обработчик обнаруживает, что ширина увеличивается и уменьшается на 1, если она обнаруживает уменьшение (вам нужно будет найти лучший алгоритм роста/уменьшения.