2016-09-08 2 views
1

Я пытаюсь сделать что-то подобноефлаги типа Highcharts с пользовательской легендой значок

enter image description here

У меня есть флаг, и это легенда же текст. Но, похоже, пользовательская легенда не работает с флагами. Правильно ли это?

type: 'flags', 
    onSeries: 'resources', 
    name: change.get('name'), 
    colorByPoint: false, 
    shape : 'circlepin', 
    width : 16, 
    color: '#939598', 
    fillColor: '#fff', 
    style: { 
    color: '#262626' 
    }, 
    data: dataArray, 
    marker: { 
     symbol: 'url(https://www.highcharts.com/samples/graphics/sun.png)' 
    } 

ответ

2

можно переопределить функцию по умолчанию, создавая элементы легенды так:

// legend wrapper 
(function (H) { 
    H.seriesTypes.flags.prototype.drawLegendSymbol = function (legend, series) { 
      var size = legend.itemHeight || 18, 
      url = series.userOptions.legendImage || 'https://www.highcharts.com/samples/graphics/snow.png'; 

     series.legendSymbol = this.chart.renderer.image(
      url, 
      0, 
      0, 
      size, 
      size 
     ).add(series.legendGroup); 
    }; 
})(Highcharts) 

Позже в настройках графика установить легенды изображения с помощью пользовательской настройки в flags серии, как:

legendImage: 'https://www.highcharts.com/samples/graphics/sun.png', 

Демонстрация: http://jsfiddle.net/mw2fn5td/

Смежные вопросы