问题描述
我有一个折线图,可以在此小提琴中看到 http://jsfiddle.net/qjmjd34d/5/
I have a line chart graph as can be seen on this fiddle http://jsfiddle.net/qjmjd34d/5/
并使用以下代码:
Highcharts.chart('container', {
plotOptions: {
series: {
color: 'purple'
}
},
series: [{
data: [{x: 1, y: 435, color:'blue'},
{x: 2, y: 437, color:'blue'},
{x: 3, y: 455, color:'blue'},
{x: 4, y: 475, color:'blue'},
{x: 5, y: 555, color:'blue'},
{x: 6, y: 435, color:'blue'}]
}]
});
修改点的颜色是忽略不计的,如何改变它们之间的线的颜色?
Modifying the color of the points is oblivious however, how is it possible to change the color of the line between them?
假设我希望小提琴中给定示例中的行仅在x = 3和x = 5之间为绿色-怎么可能?
Suppose I want the line in the given example on the fiddle to be green only between x = 3 and x = 5 - how is that possible?
推荐答案
要为图形的一部分上色,可以使用zones
.
To color part of the graph, you can use zones
.
如果将其包含在系列中,则其上方的颜色将为3到5红色.
If you include this in the series you have above it will color 3 to 5 red.
zoneAxis: 'x',
zones: [{value: 3}, {value: 5, color: 'red'}]
区域的工作方式是将着色为 value
.这意味着我们必须制作一个值为3的元素,并且没有颜色可以传递在其他位置设置的任何颜色.因此,值为5的元素将从3到5上色.
Zones work by coloring up to value
. That means that we have to make one element with value 3 and no color to pass on whatever color is set elsewhere. The element with value 5 will therefore color from 3 to 5.
工作示例: http://jsfiddle.net/qjmjd34d/6/
series.line.zones上的API : https://api.highcharts.com/highcharts/series.line.zones
这篇关于高图-更改点之间的线颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!