Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

enable disable hover in highchart.stock

Tags:

highcharts

Hello i'm working on a highchart application . if on click and move the mouse it draw a line black . the problem is it still hover the candels of the hight chart . i want to make it li this example . in this example if on click on addLine button . the cursor change to crosshaire . and we can't hover the candels of the hight chart .

the question is => how can i make the transition between enable and disable hover on candels . to draw easly the black lines . by an external button

this is my code

chart = new Highcharts.StockChart({
            chart : {
                renderTo : 'container',

            },
            },

        },


            rangeSelector : {
                selected : 1
            },

            title : {
                text : 'AAPL Stock Price'
            },

            yAxis: [{ // Primary yAxis
            lineWidth:1,
            lineColor:"#cccccc",
            labels: {
                align: 'right',
                x: 25,
                y: +5
            },
            title: {
                text: ' ',
                align: 'high',
                margin:50
            },
             showLastLabel: true,
            gridLineColor:'#cccccc',
             minorGridLineColor: '#F0F0F0',
               minorTickInterval: 'auto',
                minorGridLineDashStyle: 'longdash',
             plotLines: [{
                value: 620,
                width: 2,
                color: 'green',
                zIndex:10,
                dashStyle: 'solid',
                label: {

                    text: '<span style="background-color:#000;" >620</span>',
                    align: 'right',
                    zIndex:1000,
                    y: 2,
                    x: 25
                }
            }],



                opposite: true

            }],

            series : [{
                type : 'candlestick',
                name : 'YNS/GPB',
                data : data,

            }]
        ,
        }); 
        }
like image 590
primme Avatar asked Jan 31 '26 09:01

primme


1 Answers

You can do it via the marker property:

states: {
     hover: {
          enabled: false
     }
}

You would access this via chart.series[i].marker.states.hover I believe. So, I would think that on-click of Add Line button you would fire off the call to disable the hover on the series markers. Then, when done drawing your lines you would need to turn "off" the Add Line button and fire a call to re-enable the hover.

like image 188
wergeld Avatar answered Feb 03 '26 09:02

wergeld