google is undefined in IE only

simranali commented 5 years ago

I am using google charts and keep getting 'google' is undefined in IE(edge) I have tried many options but no luck. I am using latest 46.2 version using loader URL https://www.gstatic.com/charts/loader.js. when looking at network status code 307 on loader.js as compare to other browsers it downloads bunch of dependencies with code 200. we have specific requirement to use IE. I have used every possibility i.e. timeout allowing script to load nothing worked. please help

dlaliberte commented 5 years ago

Can you point to a page demonstrating the problem? Have you tried it in other browsers?

simranali commented 5 years ago

undefined network Yes I have works ok in chrome and ff please see above results, unfortunately I dont have a page to demonstrate. I have tried as separate file as well no luck

dlaliberte commented 5 years ago

Have you tried jsfiddle?

Alternatively, copy-paste the parts of your code here which loads the loader and calls google.charts.load(). Ideally, enough so I can recreate the problem.

Maybe if you strip down your code to a minimal subset, you will discover the cause of the problem.

simranali commented 5 years ago

thanks for your response please see following codes

<!DOCTYPE html>
<html>
  <head>
    <title>Google Developers</title>

  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
</head>
<body>
  <div id="container">
    <h4 id="chart_description"></h4>
    <div id="chart_area">

      <div id="chart_div"></div>
    </div>

  </div>

  <script type="text/javascript">
    google.charts.load('current', {packages: ['corechart', 'bar']});
    google.charts.setOnLoadCallback(drawBasic);

    function drawBasic() {

      var data = google.visualization.arrayToDataTable([
        ['City', '2010 Population',],
        ['New York City, NY', 8175000],
        ['Los Angeles, CA', 3792000],
        ['Chicago, IL', 2695000],
        ['Houston, TX', 2099000],
        ['Philadelphia, PA', 1526000]
      ]);

      var options = {
        title: 'Population of Largest U.S. Cities',
        seriesType:'bars',
        chartArea: {width: '50%'},
        hAxis: {
          title: 'Total Population',
          minValue: 0
        },
        vAxis: {
          title: 'City'
        }
      };

      var chart = new google.visualization.BarChart(document.getElementById('chart_div'));

      chart.draw(data, options);
    }

  </script>
</body>
</html>

dlaliberte commented 5 years ago

I turned that into a jsfiddle, at https://jsfiddle.net/dlaliberte/odaLgr4q/ And I tried it on IE Edge, and it seems to work fine.

simranali commented 5 years ago

yes it works in JSFiddle but when I run it as local file or localhost it gives an error google is undefined it is really annoying

dlaliberte commented 5 years ago

Sounds like it is a security issue with loading scripts from remote servers. Local files or localhost are probably special cases because you might otherwise expose files on your local machine. Check security settings, and maybe change the https://www.gstatic.com/charts/loader.js to use "http" instead.

simranali commented 5 years ago

changed https://www.gstatic.com/charts/loader.js to http then it failed "untrusted URL from google lib" then used downloaded version of loader.js changed all https to http no error but no chart either complete silence no error :(

dlaliberte commented 5 years ago

I tried just copying the jsfiddle code with the script stuck back in the html (your code posted above would be the same, but I removed the loading of 'bar' since you are not using it), saved it to windows file system, open with Edge, and it looks fine. Also ran in IE11 and Chrome, and it looks the same.

google / google-visualization-issues

google is undefined in IE only #2701