score:0

Ok, i have done!

The problem is with the perfectly horizontal (or vertical) path, probably is related with old's webkit bug

Than my solution is to edit the horizontal (and vertical) line of the grid to make it not perfectly horizontal-vertical.

//fix bug of horizontal-vertical path (TODO: check all series)
yaxis = document.getElementsByClassName('highcharts-yaxis-grid')[0].childNodes;
for (i=0; i<yaxis.length; i++) {
    if (yaxis[i].nodeName.toLowerCase() == 'path') {
        d = yaxis[i].getAttribute('d').split(' ')[2];
        yaxis[i].setAttribute('d', yaxis[i].getAttribute('d').replace(d, parseInt(d)+0.000001));
    }
}

xaxis = document.getElementsByClassName('highcharts-xaxis-grid')[0].childNodes;
for (i=0; i<yaxis.length; i++) {
    if (yaxis[i].nodeName.toLowerCase() == 'path') {
        d = yaxis[i].getAttribute('d').split(' ')[1];
        yaxis[i].setAttribute('d', yaxis[i].getAttribute('d').replace(d, parseInt(d)+0.000001));
    }
}

For example, with the following horizontal path i have to edit the first occurrency of the number 264.5, 213.5, 163

<g class="highcharts-grid highcharts-yaxis-grid ">
    <path d="M 77 264.5 L 413 264.5"></path>
    <path d="M 77 213.5 L 413 213.5"></path>
    <path d="M 77 163.5 L 413 163.5"></path>
</g>

to obtain the following non-horizontal lines

<g class="highcharts-grid highcharts-yaxis-grid ">
    <path d="M 77 264.500001 L 413 264.5"></path>
    <path d="M 77 213.500001 L 413 213.5"></path>
    <path d="M 77 163.500001 L 413 163.5"></path>
</g>

Related Query

More Query from same tag