ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

javascript – 谷歌饼图

2019-05-27 09:17:07  阅读:292  来源: 互联网

标签:php javascript pie-chart pygooglechart


用于添加3D饼图(Google图表)的JavaScript代码.视图中没有显示饼图.如何解决?

使用Javascript:

<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>

    <script type="text/javascript">
        $(function() {
            <?php
                $bookingData = array();
                $i=0;
                foreach($bookingCounts as $booking){
                $bookingData[$i]['label'] = $booking['Name'];
                $bookingData[$i]['data'] = $booking['total'];
                $i++;
                }
            ?>
            var data = <?php echo json_encode($bookingData, JSON_NUMERIC_CHECK);?>;
            console.log(data);

    var options = {
          title: 'Booking',
          is3D: true,
        };

        var chart = new google.visualization.PieChart(document.getElementById('flot-pie-chart'));
        chart.draw(data, options);


});

我的观点是:

<div class="flot-chart">
    <div class="flot-chart-content" id="flot-pie-chart">
    </div>
 </div>

解决方法:

您正在使用jQuery而不支持它(使用$()函数);快速解决方法是在主脚本之前添加此元素:

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

More on importing jQuery.

但是,如果这是你要使用的所有jQuery,我建议用$vanix JavaScript替换$(function(){/ *你的代码* /},例如:

document.addEventListener("DOMContentLoaded", function(event) { 
  /* your code here */
});

More on this.

标签:php,javascript,pie-chart,pygooglechart
来源: https://codeday.me/bug/20190527/1161968.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有