如何将结束图表的值放在底部？

Question

如何在起始图表和底部图表中设置目标值？

      data: [
        {
          indexLabelFontSize: 10,
          indexLabelFontFamily: "Arial",
          indexLabelPlacement: "inside",
          type: "doughnut",
          dataPoints: [
            { y: 50, indexLabel: "50%", indexLabelFontColor: "white"},
            { y: 50, indexLabel: "50%", indexLabelFontColor: "white"},        
          ]
        }
      ]

这是 link 我的图表更新 http://jsfiddle.net/5y7tevnv/2/

Answer 1

只放两个y值为0的数据点，一个在开始，一个在结束。希望这能满足您的要求。

var chart6 = new CanvasJS.Chart("chartContainer",
{   

  title:{
        text: "Target 2016",
        verticalAlign: "top",
        fontSize: 12              
      },  
  subtitles: [
    {
 /*     dockInsidePlotArea: true, */
      verticalAlign: "center",
      horizontalAlign: "center",
      text: "Target 200 m"
    }
  ],
  data: [
    {
      indexLabelFontSize: 10,
      indexLabelFontFamily: "Arial",
      indexLabelPlacement: "inside",
      type: "doughnut",
      dataPoints: [
        { y: 0, indexLabel: "0", indexLabelFontColor: "black"},
        { y: 50, indexLabel: "50%", indexLabelFontColor: "white"},
        { y: 50, indexLabel: "50%", indexLabelFontColor: "white"},
        { y: 0, indexLabel: "200", indexLabelFontColor: "black"},
      ]
    }
  ]
});
/* chart6 semi pie */ 
/* convert chart6 ke semi pie*/
convertToHalfDoughnut(chart6);
chart6.render();
function convertToHalfDoughnut(chart6){
  var sum = 0;
  var dataPoints = chart6.options.data[0].dataPoints;

  for(var i = 0; i < dataPoints.length; i++){
    sum += dataPoints[i].y;
  }
  dataPoints.splice(0, 0, 
    {
      y: sum, color: "transparent", toolTipContent: null});
}
/* --- */

<!DOCTYPE HTML>
<html>
<head>
<script src="http://canvasjs.com/assets/script/canvasjs.min.js"></script>
</head>
<body>
<div id="chartContainer" style="height: 300px; width: 100%;"></div>
</body>
</html>

如何将结束图表的值放在底部？

How to put value of end chart in bottom?

canvasjs