使用Highcharts solidgauge时有时会出现线条

时间:2019-08-30 15:01:19

标签: javascript highcharts

过去三年来,我一直在为项目使用Highcharts JS v4.2.3,到目前为止一切都还好。

但是,几个星期前,我开始注意到图形上方有一些线的出现(如下图所示)。

enter image description here

这是此图的JS代码:

Highcharts.chart(elementId, {
    chart: {type: 'solidgauge'},
    title: null,
    credits: {enabled:false},
    tooltip: {
        borderWidth: 0,
        backgroundColor: 'none',
        shadow: false,
        style: {fontSize: '12px'},
        pointFormat: '{series.name}<br><span style="font-size:16px; color: {point.color}; font-weight: bold">{point.y}%</span>',
        positioner: function (labelWidth, labelHeight) {return {x: 75, y: 70};}
    },
    pane: {
        startAngle: 0,
        endAngle: 360,
        background: [{
            outerRadius: '110%',
            innerRadius: '90%',
            backgroundColor:  monthPercent >= 100 ? 'rgba(30, 178, 108, 0.3)' : 'rgba(238, 167, 18, 0.3)',
            borderWidth: 0
        }, {
            outerRadius: '85%',
            innerRadius: '65%',
            backgroundColor: weekPercent >= 100 ? 'rgba(27, 133, 92, 0.3)' : 'rgba(239, 107, 23, 0.3)',
            borderWidth: 0
        }, {
            outerRadius: '60%',
            innerRadius: '40%',
            backgroundColor: dayPercent >= 100 ? 'rgba(16, 112, 127, 0.3)' : 'rgba(223, 61, 35, 0.3)',
            borderWidth: 0
        }]
    },
    yAxis: {
        min: 0,
        max: 100,
        lineWidth: 0,
        tickPositions: []
    },
    plotOptions: {
        solidgauge: {
            borderWidth: '5%',
            dataLabels: {enabled: false},
            linecap: 'square'
        }
    },
    series: [{
        name: 'Month',
        borderColor: monthPercent >= 100 ? 'rgb(30, 178, 108)' : 'rgba(238, 167, 18, '+monthAlpha+')',
        data: [{
            color: monthPercent >= 100 ? 'rgb(30, 178, 108)' : 'rgba(238, 167, 18, '+monthAlpha+')',
            radius: '100%',
            innerRadius: '100%',
            y: monthPercent
        }]
    }, {
        name: 'Week',
        borderColor: weekPercent >= 100 ? 'rgb(27, 133, 92)' : 'rgba(239, 107, 23, '+weekAlpha+')',
        data: [{
            color: weekPercent >= 100 ? 'rgb(27, 133, 92)' : 'rgba(239, 107, 23, '+weekAlpha+')',
            radius: '75%',
            innerRadius: '75%',
            y: weekPercent
        }]
    }, {
        name: 'Today',
        borderColor: dayPercent >= 100 ? 'rgb(16, 112, 127)' : 'rgba(223, 61, 35,  '+dayAlpha+')',
        data: [{
            color: dayPercent >= 100 ? 'rgb(16, 112, 127)' : 'rgba(223, 61, 35,  '+dayAlpha+')',
            radius: '50%',
            innerRadius: '50%',
            y: dayPercent
        }]
    }]
});

有人可以告诉我为什么会这样吗?

0 个答案:

没有答案