Question

友
我的目的是创建一个代表同位素表的一部分的交互式图表，您可以在此处看到，例如：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： 系列[I]。数据[j]的.marker.fillColor = “＃FF0000”

或者也许，通过我在highcharts-more.js中找到的一些代码来判断： 系列[I]。数据[j]的.markerOptions.fillColor = “＃FF0000”

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

我的问题是：在绘制图表后，是否有快速设置数百个点的标记颜色？或者我可以在绘制图表之前以某种方式更快地更改它？

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

谢谢！

Answer 1

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

您可以将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)'}}]

等等...

Answer 2

这与每次调用update（）重绘图表有关。最好禁用重绘（假参数）。

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

在散点图中为彩色单个标记着色的更好方法是什么？

2 个答案: