如何在特定阈值(超出x轴)后分割线图下的区域颜色

时间:2017-12-23 09:47:17

标签: echarts baidu

我正在使用Baidu's echarts library

如何使用areastyle在特定阈值(超出x轴)后分割折线图下的区域颜色?

谢谢!

1 个答案:

答案 0 :(得分:0)

你不能

areastyle应用于系列本身,不能绑定到单个数据点。因为区域颜色实际上标记两个数据点之间的区域

但是.. ,您可以创建一个变通方法并创建两个折线图,如下所示:

DataGrid

通过手动将其添加到图例中,并为两个系列指定相同的名称。 ECharts在一定程度上结合了这两个系列,因此传奇和动画都表现得像是一个系列。

此外,请确保通过两次添加数据点来连接两条线(请参阅legend: { data: ['myLine'] }, series : [ { name: 'myLine', type: 'line', areaStyle: { normal: { color: 'red' } }, data: [400, 300, 101, 134, null, null, null] }, { name: 'myLine', type: 'line', areaStyle: { normal: { color: 'green' } }, data: [null, null, null, 134, 90, 230, 210] }, ] )。您可以使用134等更多地自定义线条,以使它们看起来更好。

您可以通过选中the ECharts demo gallery创建一个小演示,并使用上面的代码段替换系列和图例数据(您可能需要点击蓝色运行按钮)。