如何使用javascript将自定义类名添加到Highcharts中的tick定位器

时间:2016-11-07 09:57:09

标签: javascript highcharts

我知道是否要为highcharts中的任何属性添加类或id 我可以做一些像:

yxis:{
     className:"name"
}

但我想在y轴上添加类名属性 例如:

 yAxis: {
            tickPositioner: function(min,max){
                //here want to add class name
                className:"name",
                //end here
                var data = this.series[0].processedYData,
                    ticks = this.getLinearTickPositions(this.tickInterval, min,max);
                //add last point
                val = data[data.length-1]
                ticks.push(data[data.length-1]);
                ticks.sort(function(a,b){ 
                    return a - b;
                })
                return ticks;
            }
        },

1 个答案:

答案 0 :(得分:2)

要添加自定义css类以打勾,您必须包含tick render()方法。

Highcharts.wrap(Highcharts.Tick.prototype, 'render', function (p) {
  p.call(this);

  var axis = this.axis,
    mark = this.mark,
    tickClassName = axis.options.tickClassName;

  if (tickClassName && mark) {
    mark.addClass(tickClassName, true);
  }
});

然后在选项中设置类名。

  tickClassName: 'my-tick',
  tickWidth: true, // it has to be set to non-negative value, otherwise ticks in y axis will not render

示例:https://jsfiddle.net/hpeq7Lbe/6/

如果没有换行,您可以为轴定义自定义类,然后通过.custom-class-name .highcharts-tick访问刻度线。

示例:https://jsfiddle.net/hpeq7Lbe/9/