2

朋友们,
我的目的是创建一个代表同位素表的一部分的交互式图表,您可以在此处查看,例如:http ://www.nndc.bnl.gov/chart/ 。

所以:我有一个大约 400 点的二维图。我想根据我为每个点包含的元数据的值在绘制点后对它们进行颜色编码。例如,我可能有十种红色阴影,并根据点的元数据值所在的位置进行设置。

作为测试,我尝试将它们全部涂成红色,只是为了让函数调用正确。

这是我的问题:我已经弄清楚如何使用此代码(放置在图表加载事件中)来做到这一点:

for (var i = 0; i < this.series[0].data.length; i++) {
                    this.series[1].points[i].update({
                        marker: {
                            fillColor: "#FF0000"
                        }
                    });

但我发现使用 series.points.update()非常非常慢。

我试图直接访问标记属性。我首先从我可以编写的 API 中猜测: series[i].data[j].marker.fillColor="#FF0000"

或者,根据我在 highcharts-more.js 中找到的一些代码来判断: series[i].data[j].markerOptions.fillColor="#FF0000"

但我现在看到 API 在“初始配置选项”下列出了对标记的直接调用,并且在“方法和属性”下没有直接调用。

那么我的问题是:有没有一种快速的方法可以在绘制图表后为数百个点设置标记颜色?或者我可以在绘制图表之前以某种方式更快地更改它吗?

对于它的价值,我的代码在这里:http: //jsfiddle.net/mattmcg/bn35f/13/
很长,但相关部分就在第 5-14 行。

谢谢!

4

2 回答 2

4

我会直接在数据对象中为每个点指定颜色,而不是在渲染后更新。

您可以发送任何可以在 plotOptions 中指定的内容作为点对象中的参数,例如:

data:[{x:0,y:10,marker:{fillColor:'rgba(255,0,0,.5)'}},{x:10,y:25,marker:{fillColor:'rgba(255,0,0,.75)'}},{x:25,y:30,marker:{fillColor:'rgba(255,0,0,.25)'}}]

ETC...

于 2013-08-15T14:25:22.070 回答
2

这与每次调用 update() 都会重绘图表有关。最好禁用重绘(错误参数)。

http://api.highcharts.com/highcharts#Point.update()

于 2013-08-15T14:14:05.393 回答