Dojocharts - 使用三角形而不是条形图的条形图

时间:2014-07-14 09:39:38

标签: javascript charts dojo dojox.charting

我正在生成在dojocharts中创建一个类似于条形图的图表,但使用三角形而不是矩形条(即三角形越长,它代表的值越大)。我使用面积图创建了一个traingular图表通过一些丑陋的代码。这里我的X轴标签名称没有正确显示。所以如果用0值调整它,那么它会显示所有x轴值的名称。我想知道是否有更接近我需要的东西存在,所以我不必绘制这些假的0值。我需要这个三角形状图而不是bar。这是我的jsfiddle链接[http://jsfiddle.net/kairi/UxNZD/]

这是我的三角图表代码......

     require(["dojox/charting/Chart", "dojox/charting/themes/Claro",   "dojox/lang/functional/object", "dijit/registry",
  "dojo/on", "dojo/dom", "dojo/_base/event", "dojo/parser",  "dojox/charting/axis2d/Default",
   "dojox/charting/plot2d/Areas", "dojox/charting/plot2d/Grid", "dojo/domReady!"],
   function( Chart, Claro, on, dom, baseEvent, parser) {
    // Create the base chart
    chart = new Chart("chart");
    chart.setTheme(Claro);
   chart.addAxis("x", {
fixLower: "major", natural: true, stroke: "grey",
majorTick: {stroke: "black", length: 4},
minorTick: {stroke: "gray", length: 2},
labels: [{"value":1,"text":"Green<br>View"},{"value":2,"text":"Purple"},{"value":3,"text":"Time<br>Residency"},{"value":4,"text":"Marina<br>Apartments"},{"value":5,"text":"Ivory"},{"value":6,"text":"Callidora"},{"value":7,"text":"Almeria"},{"value":8,"text":"Vastus"},{"value":20,"text":"Canary<br>Greens"},{"value":10,"text":"Terra"}],
                     font: "normal normal bold 13px Myriad Pro Light", 
                      fontColor: "black"
 });

    chart.addAxis("y", {
 vertical: true, min: 0, max: 100,
 majorTickStep:10, minorTickStep: 1, stroke: "grey",
 majorTick: {stroke: "black", length: 4},
 minorTick: {stroke: "gray", length: 2}
  });

     chart.addPlot("default", {type: "Areas",gap:10,
      lines:true,
      areas: true,
       // markers: true,
        labels: true,
        labelStyle:"inside",
        fontColor: "black"});

   chart.addSeries("Series A",
   [0,55.5,0,0,37.5,0,0,40,0,0,90,0,0,42.5,0,0,62,0,0,82.5,0,0,72,0,0,42.5,0,0,50,0]
  );      
    chart.render();
    parser.parse();

  });

我在dojo中找不到任何解决方案。所以告诉我怎么可能。 感谢任何帮助..

0 个答案:

没有答案