issue with google piechart on some sites

[Derek McGuire]

I have s script I developed for a CMS and I have been implementing the Google Piechart into the system. I just put the updates on my site and a few test sites from the CMS community, and on 2 of the 5 sites, and error occurs with the piechart.

I am trying to figure out why on these 2 sites, its not working. The error is instead of displaying the piechart as expected, it displays "a is not a function". 

Below are 2 images, The first screenshot is it working on one of the test sites and the other is where it's not. The code that is being used is as follows.

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

      ,'    <script type="text/javascript">

      google.charts.load("current", {packages:["corechart"]});

      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var data = google.visualization.arrayToDataTable([

          [\'Task\', \'Bots Caught\'],

          [\'Wait Script\', '.$waitscript.'],

          [\'Text Removal\', '.$textremoval.'],

          [\'Honeypot / Hidden Question\', '.$hidden.'],

          [\'Custom Question\', '.$customquestion.'],

          [\'SFS Blacklist\', '.$sfsspam.'],

          [\'BotScout Blacklist\', '.$bscheck.'],

          [\'FSpamlist Blacklist\', '.$fscheck.']

        ]);

        var options = {

          title: \'Honeypot Blocker Results PieChart\',

          is3D: true,

 backgroundColor: \''.$rowcolor2.'\',

 titleTextStyle: {color: \''.$fontcolor.'\', fontSize: \'32px\'},

   legendTextStyle: {color: \''.$fontcolor.'\', fontSize: \'16px\'},

 colors: [\'#00A209\', \'#486EFF\', \'#AB00BC\', \'#C30012\', \'#D08E00\', \'#00C3B4\', \'#77D100\'],

        };

        var chart = new google.visualization.PieChart(document.getElementById(\'piechart_3d\'));

        chart.draw(data, options);

      }

    </script>' , PHP_EOL;

Working

Not working

Anyone have any ideas why this does work on 3 out of the 5 sites and on 2 of them, it would display the error  "a is not a function"? Any help would be appreciated.

[Daniel LaLiberte]

Hi Derek,

It would help to see pointers to the actual web pages, so we could see what the PHP code generates.   We can't really help otherwise.  If you 'view source' on those pages, you might notice what has gone wrong.

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/e6a5a55b-5532-4a22-b268-267712029f5c%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

--

Daniel LaLiberte

dlaliberte@Google.com   5CC, Cambridge MA

[Derek McGuire]

On Thursday, October 13, 2016 at 11:50:02 AM UTC-4, Daniel LaLiberte wrote:

Hi Derek,

It would help to see pointers to the actual web pages, so we could see what the PHP code generates.   We can't really help otherwise.  If you 'view source' on those pages, you might notice what has gone wrong.

-- 

Daniel LaLiberte

dlali...@Google.com   5CC, Cambridge MA

Well, I could give links, but unfortunately, it will do no good. This script is an admin backend that can only be accessed by the admin, but I can say is the only thing being pulled from the actual site the is the numerical values of the count being pulled from the DB via the SQL. I can write up a demo page and put it up on one of the sites that is having the error which will still pull the same info and check from there.

[Derek McGuire]

Okay, here is the source code from the system.

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

   <script type="text/javascript">

      google.charts.load("current", {packages:["corechart"]});

      google.charts.setOnLoadCallback(drawChart);

      function drawChart() {

        var data = google.visualization.arrayToDataTable([

          ['Task', 'Bots Caught'],

          ['Wait Script', 169],

          ['Text Removal', 18],

          ['Honeypot / Hidden Question', 0],

          ['Custom Question', 0],

          ['SFS Blacklist', 0],

          ['BotScout Blacklist', 0],

          ['FSpamlist Blacklist', 0]

        ]);

        var options = {

          title: 'Honeypot Blocker Results PieChart',

          is3D: true,

                  backgroundColor: '#f8ce55',

                  titleTextStyle: {color: '#000000', fontSize: '32px'},

                  legendTextStyle: {color: '#000000', fontSize: '16px'},

                  colors: ['#00A209', '#486EFF', '#AB00BC', '#C30012', '#D08E00', '#00C3B4', '#77D100'],

        };

        var chart = new google.visualization.PieChart(document.getElementById('piechart_3d'));

        chart.draw(data, options);

      }

    </script>

Then the div is called:

<div id="piechart_3d" style="width: 700px; height: 500px;"></div>

I don't see why it would be stating "a is not a function" instead of the pie chart.

I also can't figure why this is happening on 2 of the 5 sites this is being tested on

[Daniel LaLiberte]

Your code appears to be working fine for me:  https://jsfiddle.net/dlaliberte/459jx0jc/

I am using Chrome on Linux for this.  Is there a platform where it fails for you?

The error "a is not a function" indicates there is a bug in our code, possibly, and if so, I'd like to know what caused it, but if it is caused by something else on your page that interferes with the Google Charts code, then where the bug is becomes debatable.

--

You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/c91d2843-c9cb-417d-a092-e66d06edcbef%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.

[coRpSE]

Okay, I rewrote my test script and put it on one of the sites where its broken. This time I wrote it so its stand alone and connected to their DB, but not using any of the functions/files of the CMS or anything of their templet and it works. So there, now I have to find to commonality of both of their sites that is causing this so when I release this updated version of my antibot script, I will have a better understanding of what is going on. Now that I am 100% positive that it's something in the CMS on their end, (probably added by them or not upgraded/updated), I thank you for your assistance and I will post once I have a fix and inform you of what was causing the issue. Thankyou again.

[coRpSE]

Okay, we were able to figure out what the issue was. The guys that were running an older version and then upgraded to the current version of the CMS still had a file that was no longer being used. Has not been used in many years. It was a file called prototype.js version 1.5 from prototypejs.org. Something with the google charts code did not like the prototype.js. I will just post with the readme if they are running an updated version of the old CMS, that they have to remove the inclusion of the file and just delete the file from their site.

On Monday, October 17, 2016 at 10:14:06 AM UTC-4, Daniel LaLiberte wrote:

Your code appears to be working fine for me:  https://jsfiddle.net/dlaliberte/459jx0jc/

I am using Chrome on Linux for this.  Is there a platform where it fails for you?

The error "a is not a function" indicates there is a bug in our code, possibly, and if so, I'd like to know what caused it, but if it is caused by something else on your page that interferes with the Google Charts code, then where the bug is becomes debatable.

[Daniel LaLiberte]

Thanks for the update.  Old versions of prototypejs are known to have caused problems with many js libraries, because it adds methods to Object and Array.

--

You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualization-api+unsub...@googlegroups.com.
To post to this group, send email to google-visualization-api@googlegroups.com.
Visit this group at https://groups.google.com/group/google-visualization-api.

To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/a80748ea-1ee5-4998-80eb-9c1999c81db3%40googlegroups.com.

For more options, visit https://groups.google.com/d/optout.