RGraph折线图上特定点的颜色不同

时间:2019-05-14 09:19:11

标签: javascript canvas rgraph

我正在尝试在定义了highlightStyle: 'halo',tickmarksStyle: ['circle']的点中指定颜色。

图:

enter image description here

如果这些点超过了蓝线,我想将它们的颜色更改为红色。条件并不重要,但似乎无法解决。

或者,如果更简单,如果主线超过蓝线,则将线段颜色更改为红色。

我一直在查看Line chart API,但是找不到适合我的情况的参数。

我该怎么办?

1 个答案:

答案 0 :(得分:1)

如果我正确理解了您的请求,那么最简单的方法就是使用本演示中的 filledThreshold filledThresholdColors 属性:

https://www.rgraph.net/tests/canvas.line/threshold.html

代码如下:

new RGraph.Line({
    id: 'cvs',
    data: [d1, d2],
    options: {
        backgroundGridHlinesCount: 5,
        backgroundGridVlines: false,
        backgroundGridBorder: false,
        axes: false,
        filled: true,
        filledRange: true,
        filledRangeThreshold: 12,
        filledRangeThresholdColors: ['red', 'blue'],
        xaxisLabels: ['A','B','C','D','E','F','G','H','I','J','K','L','M','N','O','P'],
        colors: ['transparent', 'transparent'],
        xaxisTickmarksCount: 15,
        tickmarksStyle: null
    }
}).draw();