简体   繁体   English

谷歌图表未在 Safari 上显示

[英]Google charts not showing on Safari

I'm trying to draw a Pie-chart with Google charts.我正在尝试使用 Google 图表绘制饼图。 It's working fine on Chrome and my Firefox, but not on a friend's Firefox nor on my Safari.它在 Chrome 和我的 Firefox 上运行良好,但不适用于朋友的 Firefox 和我的 Safari。 I've been through everything I can think of or read about.我经历了我能想到或读到的一切。 The id's are correct when I view the source.当我查看源代码时,ID 是正确的。

To narrow it down, I've added some text to the console.log, firstly after document.ready and secondly inside the drawchart function.为了缩小范围,我在 console.log 中添加了一些文本,首先是在 document.ready 之后,其次是在 drawchart 函数中。 The 'Document Ready' text is appearing on all browsers, but then on some, it's not going into the drawchart function at all. “文档就绪”文本出现在所有浏览器上,但在某些浏览器上,它根本没有进入绘图功能。

Here's how I have it set up in my HTML head.这是我如何在我的 HTML 头中设置它。

<head>
    <script src="http://code.jquery.com/jquery-1.9.0rc1.js"></script>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <script src="js/sortable.js"></script>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
    <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
    <script>$(function() { $( ".SStabs" ).tabs(); }); </script>

    <!--Load the charts API-->
    <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>


</head>

There's a few other things in there such as JQuery UI, not sure if they could be clashing or something.那里还有其他一些东西,例如 JQuery UI,不确定它们是否会发生冲突或其他什么。

Then in my JS I have ....然后在我的JS中我有....

$(document).ready(function() {

console.log('Document Ready');

// Load the Visualization API and the corechart package.
google.charts.load('current', {'packages':['corechart']});

// Set a callback to run when the Google Visualization API is loaded.
google.charts.setOnLoadCallback(drawChart);

});

And my drawchart function is this.... note that on the failing browsers, it doesn't even show the console log text.我的绘图功能是这样的……请注意,在失败的浏览器上,它甚至不显示控制台日志文本。 On the others, it works all the way through and displays the charts correctly, so I don't think it's an issue with this function.在其他方面,它一直工作并正确显示图表,所以我认为这不是这个功能的问题。 I think the issue is with the callback because it's not even reaching this function.我认为问题出在回调上,因为它甚至没有达到这个功能。

function drawChart() {
    console.log('Drawchart');

    var thisChartElement = document.getElementById('match_stat_pie_chart0');

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'test');
    data.addColumn('number', 'kkkk');
    data.addRows([
      ['a', 9],
      ['b', 8]
    ]);

    // Set chart options
    var options = {'title':'Percentage of Play', colors:['red', 'blue'], 'is3D':true, 'width':400, 'height':300};

    // Instantiate and draw the chart, passing in the options.
    var chart = new google.visualization.PieChart(document.getElementById('match_stat_pie_chart0'));
    chart.draw(data, options);
}

The ID is correct, I've cut and pasted to make sure it's spelt exactly right. ID 是正确的,我已剪切并粘贴以确保其拼写完全正确。 And as I say, it works on several browsers.正如我所说,它适用于多种浏览器。

I know this is an old question but you could try to place google.charts.setOnLoadCallback(drawChart) outside of $(document).ready我知道这是一个老问题,但您可以尝试将 google.charts.setOnLoadCallback(drawChart) 放在 $(document).ready 之外

google.charts.setOnLoadCallback(drawChart) have some problems being called within other functions google.charts.setOnLoadCallback(drawChart) 在其他函数中调用时有一些问题

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM