代码之家  ›  专栏  ›  技术社区  ›  Venky

如何在c3js饼图上绘制定制的JSON数据?

  •  1
  • Venky  · 技术社区  · 7 年前

    JSON看起来像这样(这是动态数据):

    {"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]}
    

    HTML:

    <div id="chart"></div>
    

    JS(我实际尝试的):

    var json ={"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]};
    var ug =json.ug;
    var wtv=json.wtv;     
    var chart = c3.generate({
        data: {
           json: {
              ug:wtv[0],
              ug1:wtv[1],
              ug2:wtv[2],
              ug3:wtv[3],
            },
            type : 'pie',
        }
    });
    

    Here is a fiddle for reference.

    有人能帮我根据需要操作数据来绘制饼图吗?

    1 回复  |  直到 7 年前
        1
  •  2
  •   WhiteHat    7 年前

    "ug" "wtv" 具有相同数量的元素。。。

    var json = {"ug":["K","M2","M3","M4"],"wtv":[10,20,35,60]};
    var pieJson = {};
    json.ug.forEach(function (ug, index) {
      pieJson[ug] = json.wtv[index];
    });
    
    var chart = c3.generate({
      data: {
        // iris data from R
        json: pieJson,
        type : 'pie',
      }
    });
    

    jsfiddle.net/4h4z00g7/