草庐IT

javascript - ZingChart 遵循了 mysql 教程,但我想要一个馅饼而不是一个酒吧

coder 2023-10-10 原文

我对所有这些东西都很陌生,这可能是一个简单的解决方案,但我无法弄清楚。我遵循了 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> 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>

我想使用具有这种格式的派

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

谁能帮帮我?

最佳答案

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

我的数据 = [98,12,36,76];

饼图中的每个饼图切片都需要在 series 中有自己的对象,并具有采用单个值数组的 values 属性。因此,如果您的 myData 数组中有四个值,您可以这样做:

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] ]
                }
            ]
        }
    });
};

我是 ZingChart 团队的一员,请告诉我我可以提供任何帮助!

关于javascript - ZingChart 遵循了 mysql 教程,但我想要一个馅饼而不是一个酒吧,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30780376/

有关javascript - ZingChart 遵循了 mysql 教程,但我想要一个馅饼而不是一个酒吧的更多相关文章

  1. ruby - 使用 Vim Rails,您可以创建一个新的迁移文件并一次性打开它吗? - 2

    使用带有Rails插件的vim,您可以创建一个迁移文件,然后一次性打开该文件吗?textmate也可以这样吗? 最佳答案 你可以使用rails.vim然后做类似的事情::Rgeneratemigratonadd_foo_to_bar插件将打开迁移生成的文件,这正是您想要的。我不能代表textmate。 关于ruby-使用VimRails,您可以创建一个新的迁移文件并一次性打开它吗?,我们在StackOverflow上找到一个类似的问题: https://sta

  2. ruby-on-rails - Rails - 一个 View 中的多个模型 - 2

    我需要从一个View访问多个模型。以前,我的links_controller仅用于提供以不同方式排序的链接资源。现在我想包括一个部分(我假设)显示按分数排序的顶级用户(@users=User.all.sort_by(&:score))我知道我可以将此代码插入每个链接操作并从View访问它,但这似乎不是“ruby方式”,我将需要在不久的将来访问更多模型。这可能会变得很脏,是否有针对这种情况的任何技术?注意事项:我认为我的应用程序正朝着单一格式和动态页面内容的方向发展,本质上是一个典型的网络应用程序。我知道before_filter但考虑到我希望应用程序进入的方向,这似乎很麻烦。最终从任何

  3. ruby-on-rails - 渲染另一个 Controller 的 View - 2

    我想要做的是有2个不同的Controller,client和test_client。客户端Controller已经构建,我想创建一个test_clientController,我可以使用它来玩弄客户端的UI并根据需要进行调整。我主要是想绕过我在客户端中内置的验证及其对加载数据的管理Controller的依赖。所以我希望test_clientController加载示例数据集,然后呈现客户端Controller的索引View,以便我可以调整客户端UI。就是这样。我在test_clients索引方法中试过这个:classTestClientdefindexrender:template=>

  4. ruby-on-rails - 如果 Object::try 被发送到一个 nil 对象,为什么它会起作用? - 2

    如果您尝试在Ruby中的nil对象上调用方法,则会出现NoMethodError异常并显示消息:"undefinedmethod‘...’fornil:NilClass"然而,有一个tryRails中的方法,如果它被发送到一个nil对象,它只返回nil:require'rubygems'require'active_support/all'nil.try(:nonexisting_method)#noNoMethodErrorexceptionanymore那么try如何在内部工作以防止该异常? 最佳答案 像Ruby中的所有其他对象

  5. ruby - 为什么 SecureRandom.uuid 创建一个唯一的字符串? - 2

    关闭。这个问题需要detailsorclarity.它目前不接受答案。想改进这个问题吗?通过editingthispost添加细节并澄清问题.关闭8年前。Improvethisquestion为什么SecureRandom.uuid创建一个唯一的字符串?SecureRandom.uuid#=>"35cb4e30-54e1-49f9-b5ce-4134799eb2c0"SecureRandom.uuid方法创建的字符串从不重复?

  6. ruby-on-rails - Rails - 从另一个模型中创建一个模型的实例 - 2

    我有一个正在构建的应用程序,我需要一个模型来创建另一个模型的实例。我希望每辆车都有4个轮胎。汽车模型classCar轮胎模型classTire但是,在make_tires内部有一个错误,如果我为Tire尝试它,则没有用于创建或新建的activerecord方法。当我检查轮胎时,它没有这些方法。我该如何补救?错误是这样的:未定义的方法'create'forActiveRecord::AttributeMethods::Serialization::Tire::Module我测试了两个环境:测试和开发,它们都因相同的错误而失败。 最佳答案

  7. ruby - 用 Ruby 编写一个简单的网络服务器 - 2

    我想在Ruby中创建一个用于开发目的的极其简单的Web服务器(不,不想使用现成的解决方案)。代码如下:#!/usr/bin/rubyrequire'socket'server=TCPServer.new('127.0.0.1',8080)whileconnection=server.acceptheaders=[]length=0whileline=connection.getsheaders想法是从命令行运行这个脚本,提供另一个脚本,它将在其标准输入上获取请求,并在其标准输出上返回完整的响应。到目前为止一切顺利,但事实证明这真的很脆弱,因为它在第二个请求上中断并出现错误:/usr/b

  8. ruby - 一个 YAML 对象可以引用另一个吗? - 2

    我想让一个yaml对象引用另一个,如下所示:intro:"Hello,dearuser."registration:$introThanksforregistering!new_message:$introYouhaveanewmessage!上面的语法只是它如何工作的一个例子(这也是它在thiscpanmodule中的工作方式。)我正在使用标准的ruby​​yaml解析器。这可能吗? 最佳答案 一些yaml对象确实引用了其他对象:irb>require'yaml'#=>trueirb>str="hello"#=>"hello"ir

  9. ruby - Rails 关联 - 同一个类的多个 has_one 关系 - 2

    我的问题的一个例子是体育游戏。一场体育比赛有两支球队,一支主队和一支客队。我的事件记录模型如下:classTeam"Team"has_one:away_team,:class_name=>"Team"end我希望能够通过游戏访问一个团队,例如:Game.find(1).home_team但我收到一个单元化常量错误:Game::team。谁能告诉我我做错了什么?谢谢, 最佳答案 如果Gamehas_one:team那么Rails假设您的teams表有一个game_id列。不过,您想要的是games表有一个team_id列,在这种情况下

  10. 使用canal同步MySQL数据到ES - 2

    文章目录一、概述简介原理模块二、配置Mysql使用版本环境要求1.操作系统2.mysql要求三、配置canal-server离线下载在线下载上传解压修改配置单机配置集群配置分库分表配置1.修改全局配置2.实例配置垂直分库水平分库3.修改group-instance.xml4.启动监听四、配置canal-adapter1修改启动配置2配置映射文件3启动ES数据同步查询所有订阅同步数据同步开关启动4.验证五、配置canal-admin一、概述简介canal是Alibaba旗下的一款开源项目,Java开发。基于数据库增量日志解析,提供增量数据订阅&消费。Git地址:https://github.co

随机推荐