Dojo 图表：我可以根据值更改线条的颜色吗？答案

【问题标题】：Dojo charting: Can i change the color of the line based on the value?Dojo 图表：我可以根据值更改线条的颜色吗？
【发布时间】：2012-11-25 15:16:53
【问题描述】：

我有一个使用 Dojo 1.8 的工作图表。

chart1 = new dojox.charting.Chart2D("chart1");
chart1.addPlot("default", {type: "Lines", ...
chart1.addSeries("Series A", [{ x: 1, y: 2.3, tooltip: "Value 1"}, ...

我的系列数据正确显示为行，整行（系列）的颜色为“绿色”。我知道如何更改整个系列的颜色，但是线条是否有可能根据数据值改变颜色？让我们假设 x 轴是一个时间轴，我需要线（系列）直到今天是绿色的，然后是红色的未来值。这可能吗？如何？（我正在使用值的标记。如果这些可以根据值改变就足够了）

我在文档中发现了类似的内容：

chart.addSeries("Series A", [
    {y: 4, color: "red"},
    {y: 2, color: "green"},
    {y: 1, color: "blue"},
    {y: 1, text: "Other", **color: "white", fontColor: "red"**}
]);

但它仅适用于 PIE 图表，不适用于 LINES 图表。

提前谢谢你。

【问题讨论】：

标签： dojo dojox.charting

【解决方案1】：

你可以试试这个http://jsfiddle.net/jUS54/

在 addPlot 方法中使用 styleFunc 来改变标记颜色：

 var chart1 = new Chart("simplechart");
    chart1.addPlot("default", {type: Lines, markers:true, styleFunc: function(item {
    if(item <= 2){ 
      return { fill : "red" };
    }else if(item > 3){
      return { fill: "green" };
    }
    return {};
  }});

【讨论】：

如果我需要基于物品价值以外的颜色怎么办？
@Petr 在 styleFunc 旁边的函数上，您可以传递您在代码中声明的任何对象。您是否有一个您需要使用的值的示例，以便我可以创建一个 jsfiddle？

【解决方案2】：

您可以通过向图表数据添加“填充”来更改颜色。基本上，在为 chartData 构建 JSON 时，循环遍历您的输入数据来决定设置填充的内容。

var chartData = [{y: 10000,fill: "red"},{y:9200,fill: "yellow"},{y:11811,fill: "green"},{y:12000,fill: "blue"},{y:7662,fill: "blue"},{y:13887,fill: "black"},{y:14200,fill: "gray"},{y:12222,fill: "purple"},{y:12000,fill: "green"},{y:10009,fill: "purple"},{y:11288,fill: "green"},{y:12099,fill: "blue"}];

http://jsfiddle.net/goinoff/QnNk2/1/

【讨论】：

没试过但是把数据里的'fill:"red"'改成'color:"red"'？？