2

考虑：

value1 = 5;
v1_color = #ff0000;

value2 = 4;
v2_color = #00ff00;

value3 = 3;
v3_color = #0000ff;

var r = Raphael("holder");
pie = r.piechart(320,320,250,{value1,value2,value3},{colors: [v1_color, v2_color,v3_color]});

这将产生一个饼图，上面的切片是红色的，右下角的切片是绿色的，最后一个切片是蓝色的。但是，如果像这样更改值：

value1 = 4;
value2 = 3;
value3 = 5;

图表看起来完全一样，但颜色不再代表正确的值。在源代码中，第 99-101 行显示了正在排序的值，但仅此而已。

我想要一种颜色对应于某个变量，无论它有多大，而不是让最大的变量获得选项中列出的第一个颜色。

在它绘制切片的代码部分（第 133 行）中，它指的是opts.matchColors，但我找不到任何关于在调用函数时如何设置它的文档。

任何想法如何实现这一目标？

4

1 回答 1

7

不幸的是 opts.matchColors 根本没有记录，因为它正是您所需要的。

opts.matchColors 强制它将颜色数组的顺序与值数组的顺序相匹配。当值按大小重新排序时，颜色将以其原始值应用于楔形。

matchColors 默认为 false，因此您需要在选项数组中显式设置它，如下所示：

var pie = r.piechart(320, 320, // 中心
                     250, // 半径
                     [
                         值1，
                         值2，
                         价值3
                     ],
                     {
                         颜色 ： [
                                            v1_color,
                                            v2_color,
                                            v3_color
                                        ],
                          匹配颜色：真
                     });
于 2013-01-16T00:35:08.533 回答