2013-09-22 65 views
0

我现在使用Dojo显示折线图。但我不知道如何改变系列线的颜色,有谁会帮忙?谢谢。如何更改Dojo中的图表系列线条颜色?

var chart1 = new dc.Chart("test1"); 
    chart1.addPlot("default", { type: "Default", lines: true, markers: true, tension: 1 }); 
    chart1.addAxis("x", { majorTick: { stroke: "black", length: 5 }, minorTick: { stroke: "black", length: 1} }); 
    chart1.addAxis("y", { vertical: true, majorTick: { stroke: "black", length: 5 }, minorTick: { stroke: "black", length: 1} }); 
    chart1.addSeries("Series A", [{ x: 0.5, y: 5 }, { x: 1.5, y: 1.5 }, { x: 2, y: 9 }, { x: 5, y: 0.3}]); 
    chart1.addSeries("Series B", [{ x: 0.3, y: 8 }, { x: 4, y: 6, tooltip: "Custom tooltip" }, { x: 5.5, y: 2}]); 
    chart1.addSeries("Series C", [{ x: 0.8, y: 6 }, { x: 8, y: 1, tooltip: "Custom tooltip" }, { x: 7, y: 2}]); 
    chart1.addSeries("Series D", [{ x: 0.1,y: 5}, { x: 2, y: 3, tooltip: "Custom tooltip" }, { x: 4, y: 5}]); 

    var anim1a = new dc.action2d.Magnify(chart1, "default"); 
    var anim1b = new dc.action2d.Tooltip(chart1, "default"); 
    chart1.render(); 

对于A系列,B系列,C系列,D系列,我想用我定义的颜色来显示它们,任何人都可以提供帮助吗?

回答

0

你或许可以同时提供色彩在你的系列为它由图中可以使用。类似以下内容:

chart1.addSeries("Series A", 
     [{ x: 0.5, y: 5 }, { x: 1.5, y: 1.5 }, { x: 2, y: 9 }, { x: 5, y: 0.3}], 
     { stroke: "green" }); 
0

您可以在定义图表时使用setTheme()函数更改颜色。

必须像:

require(["dojox/charting/Chart", "dojox/charting/themes/Shrooms", "dojox/charting/plot2d/Areas", ...], 
function(Chart, Shrooms, Areas, ...){ 
    new Chart(node) 
    addPlot("default", { type: Areas, tension: "X" }) 
    setTheme(Shrooms) 
    addSeries("Series A", [1, 2, 0.5, 1.5, 1, 2.8, 0.4]) 
    addSeries("Series B", [2.6, 1.8, 2, 1, 1.4, 0.7, 2]) 
    addSeries("Series C", [6.3, 1.8, 3, 0.5, 4.4, 2.7, 2]) 
    render(); 
}); 

在这个例子中,主题是 “蘑菇” 将被载入。

在这里你可以看到,什么题材都可以图表:

http://demos.dojotoolkit.org/demos/chartTypes/demo.html

和Dojo API,你可以找到他们在DojoX中/图表/主题英寸

这里有一个很好的教程,你怎么能自己定义的主题: http://dojotoolkit.org/documentation/tutorials/1.9/charting/

问候,杨千嬅

+0

对不起,上面的代码没有为我的方案工作。 – CharlieShi

+0

我通过修改base.js改变了颜色 – CharlieShi

相关问题