主要包括:
no-data-display:用于图表没有数据的时候给用户一提示信息如显示“无数据”而不是空白
customEvent:用于增加除了highcharts本身支持的单击事件以为的事件,如鼠标右键

boost:用于渲染大量数据的插件,提高插件渲染速度。数据量一般超过5000个点。

 

在开发过程中如果不使用boost插件应该是不会有太大的问题,主要是采用了boost插件后由于为提高渲染速度采用的不是svg绘图的方式,会产生一些问题。
浏览器打开如下地址:http://jsfiddle.net/gh/get/library/pure/highcharts/highcharts/tree/master/samples/highcharts/demo/scatter-boost/
在左上角的html区域增加一行代码<script src="https://code.highcharts.com/modules/no-data-to-display.js"></script>

然后点击run按钮,发现图表虽然能够渲染出来但是显示了“no data to display”信息,显然这不是我们想要的结果。

尝试在左下部分图表配置的代码中增加click事件,发现没有生效。

同时我想一些图表不采用boost机制即使一些数据大于默认的5000个点。

 

 

1、boost是否启用
增加boost:{enabled:false} 属性,避免自动开启boost机制导致有数据时仍提示没有数据。
如果设置了zone效果失效,可以通过增加 plotOptions: {series: {   boostThreshold:0}。
2、采用boost情况
不显示没有数据的提示信息:修改no-data-to-display的源码大约142行左右增加一个图表类型如果你的图表类型存在其中则不需要增加,我用的是散点图,需要增加一行'scatter'   ---主要是判断是否数据存在的方法
增加事件信息如单击:本身boost是不支持事件信息的,通过搜索互联网貌似通过halo可是实现,代码如下:
    

point: {
                events: {
                    click: function() {
                        alert("click");
                        console.log(this);
                    },
                    mouseOver: function() {
                        if (this.series.halo) {
                            this.series.halo.attr({
                                'class': 'highcharts-tracker'
                            }).toFront();
                        }
                    }
                }
            },

  

如果你的页面没有引入customEvent插件这样应该是可以正常使用了,如果引用了,那么鼠标单击还是无效的。
尝试能够通过类似boost那样多customEvent插件进行修改,增加一个参数enabled默认是开启这个插件,如果设置为false则不启用。
修改customEvent.js大约78行增加:

var enabled=true;
      //chart增加属性 customEvent:{enabled:false}使该插件失效
      if (chart && chart.options && chart.options.customEvent) {
        enabled = typeof chart.options.customEvent.enabled === 'undefined' ?
            true :
            chart.options.customEvent.enabled;
      }


      if (enabled){
       //原有代码
}
  // call default action
      proceed.apply(this, Array.prototype.slice.call(arguments, 1));

  


当然了个人只是从使用角度进行了实现,没有深究底层实现的机制,如果大家有更好的办法或不对之出,欢迎指正。

 

基于highchart6的整合demo,解压后查看demo.html!