3

（以前にも同様の質問をしたことがありますが、問題が再び発生しました。）

ZingCharts を使用した非常に単純な円グラフがありますが、ZingCharts サイトのすべての例で各スライスのパーセンテージが表示されていますが、表示するパーセンテージを取得できません。値ボックスを使用していることに注意してください。CDN の最新バージョンの ZingCharts を使用しています: https://cdn.zingchart.com/zingchart.min.js

各スライスに線で付けられたテキストである値ボックスではなく、スライスに表示されるパーセンテージを探していることに注意してください。

これが私のコードです：

<div id="pie-chart">&nbsp;</div>

<script>
var slices = var slices = slices = [
    {"values":[59],"text":"USA"},
    {"values":[55],"text":"UK"}
];

var chartData = {
    "type":"pie",
  "plot":{
    "value-box":{
      "visible":true,
      "placement":"out",
      "text":"%t (%v)"
    }
  },
    "series": slices
};

zingchart.render({
        id:"pie-chart",
        data: chartData,
        height:400,
        width:"100%"
    });
</script>

より効果の高い円グラフではなく、標準の円グラフを使用したい。

4

1 に答える 1

5

チャートにパーセンテージ値を表示するには、生の値を表示する%npv代わりに (node-percent-value) トークンを使用する必要があります。%v円グラフの種類のページの詳細: http://www.zingchart.com/docs/chart-types/pie/

値ボックスのデフォルトの機能は

       "value-box" : {
          "placement" : "in",
          "text" : "%npv%"
       }

したがって、JSON からそれを省略することを選択できます。以下の例では、オプションを明示的に指定した JSON を示しています。

var slices = [
  {"values":[59],"text":"USA"},
  {"values":[55],"text":"UK"}
];
var chartData = {
    "type":"pie",
    "series": slices,
    "plot" : {
       "value-box" : {
          "placement" : "in",
          "text" : "%npv%"
       }
     }
};

zingchart.render({
        id:"pie-chart",
        data: chartData,
        height:400,
        width:"100%"
    });
<script src="https://cdn.zingchart.com/zingchart.min.js"></script>
<div id="pie-chart"></div>

于 2016-02-08T21:07:38.610 に答える