highcharts - 通过外部按钮启用/禁用 CrossHaires

Question

  tooltip: {
        crosshairs: [{
                        dashStyle: 'dash'
                    },{
                       dashStyle: 'dash'     
                    }]
                },
....

    $("#toggleCrossHaire").click(function(){
     if(chart.tooltip.crosshaires){
      chart.tooltip.crosshaires : [false,false];
    }eles{
      chart.tooltip.crosshaires : [true,true];
    }
    });

启用或禁用和更改 Crosshairs 的 dashStyle 。到坚实和破折号。通过外部按钮？？

这个例子以获得更多解释

Answer 1

You can do it the following way:

• Get the current dashstyle
• Change it according to the style you want
• Force Highcharts to redraw

$("#toggle").click(function(){
    var options = chart.options;
    var dashStyle = options.tooltip.crosshairs[0].dashStyle == "Solid" ? "Dot" : "Solid";
    options.tooltip.crosshairs = [{
        dashStyle: dashStyle
    }, {
        dashStyle: dashStyle
    }]
    chart = new Highcharts.Chart(options);
});

demo1

Note that the code abode works only for two crosshairs.
If you want to do it with only one you have to create the chart and set crosshairs with the second disabled:

tooltip: {
    crosshairs: [{
        dashStyle: "Solid"
    }, false]
}

// remember to change the following line, because we just want to set the first one

options.tooltip.crosshairs = [{
    dashStyle: dashStyle
}]

demo2