ZingChart跟着mysql教程，但我想要一个馅饼而不是吧

问题描述

我对所有这些东西都很新，这可能是一个简单的解决方案，但我无法弄明白。我按照ZingChart的mysql教程，我能够看到我创建的栏，但我想要一个饼图。

 < ; div class =row> 
< div class =col-lg-12> 
< div class =panel panel-default> 
< div class =panel-heading> 
< h3 class =panel-title>< i class =fa fa-long-arrow-right fa-fw>< / i>饼图< / h3> 
< / div> 
<？php 
 $ sqlpie =SELECT Naam，Voorraad FROM product WHERE Voorraad！= 0; 
 $ data = mysqli_query（$ con，$ sqlpie）; 
？> 
 
< script> 
 var myData = [<？php 
 while（$ info = mysqli_fetch_array（$ data））
 echo $ info ['Voorraad']。'，'; / *我们使用连接运算符'。'在每个数据值后添加逗号分隔符。 * / 
？>]; 
<？php 
 $ data = mysqli_query（$ con，SELECT * FROM Product WHERE Voorraad！= 0）; 
？> 
 var myLabels = [<？php 
 while（$ info = mysqli_fetch_array（$ data））
 echo''。$ info ['Naam']。'，'; / *这里使用连接运算符'。'来从我们的数据库名称创建字符串值。 * / 
？>]; 
< / script> 
< script> 
 window.onload = function（）{
 zingchart.render（{
 id：pieChart，
宽度：100％，
身高：400， 
数据：{
类型：bar，
scale-x：{
labels：myLabels 
}，
系列：[
 {
值：myData 
 
} 
] 
} 
}）; 
}; 
< / script> 
 
< div class =panel-body> 
< div id =pieChart>< / div> 
< / div> 
< / div> 
< / div> 
 
< / div> 
  

我想使用具有此格式的Pie

 type：pie3d，
系列：[
 {
text：Apples，
值：[5] 
}，
 {
text：Oranges，
values：[8] 
}，
 {
text：Bananas，
values：[22] 
}，
 {
text：Grapes，
值：[16] 
}，
 {
text：Cherries，
values：[12] 
} 
] 
  

任何人都可以帮助我吗？

解决方案

如果您能够获得条形图，那么您的myData JavaScript变量可能如下所示：

myData = [98,12,36,76];

饼图中的每个饼图切片都需要系列中的自己的对象，带有 values 属性，该属性采用单个值数组。因此，如果你的myData数组中有四个值，你可以这样做：

  var myData = [98,12， 36,76]; 
 
 window.onload = function（）{
 zingchart.render（{
 id：pieChart，
宽度：100％，
高度：400，
数据：{
类型：馅饼，
系列：[
 {
值：[myData [0] ] 
}，
 {
值：[myData [1]] 
}，
 {
值：[myData [2] ] 
}，
 {
值：[myData [3]] 
} 
] 
} 
}）; 
}; 
  

我在ZingChart团队，所以让我知道我可以做任何其他事情来帮助你！ / p>

I'm pretty new with all this stuff and it may be an easy solution but i can't figure it out. I followed the mysql tutorial for ZingChart and i am able to see my bar i created, but i want a pie chart.

<div class="row">
                <div class="col-lg-12">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            <h3 class="panel-title"><i class="fa fa-long-arrow-right fa-fw"></i> Pie Chart</h3>
                        </div>
                        <?php 
                            $sqlpie = "SELECT Naam,Voorraad FROM product WHERE Voorraad != 0";
                            $data = mysqli_query($con, $sqlpie);
                        ?>

                        <script>
                        var myData=[<?php 
                        while($info=mysqli_fetch_array($data))
                             echo $info['Voorraad'].','; /* We use the concatenation operator '.' to add comma delimiters after each data value. */
                        ?>];
                        <?php
                            $data=mysqli_query($con,"SELECT * FROM Product WHERE Voorraad !=0");
                        ?>
                            var myLabels=[<?php 
                            while($info=mysqli_fetch_array($data))
                            echo '"'.$info['Naam'].'",'; /* The concatenation operator '.' is used here to create string values from our database names. */
                        ?>];
                        </script>
                        <script>
                                 window.onload=function(){
                                    zingchart.render({
                                        id:"pieChart",
                                        width:"100%",
                                        height:400,
                                        data:{
                                        "type":"bar",
                                        "scale-x":{
                                            "labels":myLabels
                                        },
                                        "series":[
                                            {
                                                "values":myData

                                            }
                                    ]
                                    }
                                    });
                                    };
                    </script>

                        <div class="panel-body">
                            <div id="pieChart"></div>    
                        </div>
                    </div>
                </div>

            </div>

I want to use the Pie which has this format

"type":"pie3d",
"series":[
    {
        "text":"Apples",
        "values":[5]
    },
    {
        "text":"Oranges",
        "values":[8]
    },
    {
        "text":"Bananas",
        "values":[22]
    },
    {
        "text":"Grapes",
        "values":[16]
    },
    {
        "text":"Cherries",
        "values":[12]
    }
]

Can anybody help me?

解决方案

If you were able to get a bar chart, then your myData JavaScript variable probably looks something like this:

myData = [98,12,36,76];

Each pie slice in a pie chart requires its own object within series, with a values attribute that takes a single value array. So if you have four values in your myData array, you could do something like this:

var myData = [98,12,36,76];

window.onload=function(){
    zingchart.render({
        id:"pieChart",
        width:"100%",
        height:400,
        data:{
            "type":"pie",
            "series":[
                {
                    "values": [ myData[0] ]
                },
                {
                    "values": [ myData[1] ] 
                },
                {
                    "values": [ myData[2] ]
                },
                {
                    "values": [ myData[3] ]
                }
            ]
        }
    });
};

I'm on the ZingChart team, so let me know I can do anything else to help!

这篇关于ZingChart跟着mysql教程，但我想要一个馅饼而不是吧的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！