3

我正在使用 symfony 生成一个简单的 highcharts 图，但是 wkhtmltoimage 没有正确显示网格线：

wkhtmltoimage highcharts 图

我的knp_snappy.image配置如下：

options:
        encoding:           UTF-8
        format:             svg
        width:              0
        enable-smart-width: true
        zoom:               3

我在图中添加了以下选项：

plotOptions: {
        series: {
                shadow: false,
                animation:false,
                enableMouseTracking: false
        }
}

我究竟做错了什么？如果我使用 wkhtmltopdf 输出是正确的..

4

1 回答 1

0

好的，我已经完成了！

问题在于完美的水平（或垂直）路径，可能与旧的 webkit 错误有关

我的解决方案是编辑网格的水平（和垂直）线，使其不是完美的水平垂直。

//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));
    }
}

例如，使用以下水平路径，我必须编辑数字 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>

获得以下非水平线

<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>
于 2017-05-05T16:28:02.847 回答