Google Geo Chart

How to use?

Copy-paste the following <script> near the end of your pages under JS Implementing Plugins to enable it.

            
              <script src="//www.gstatic.com/charts/loader.js"></script>
            
          

Copy-paste the following <script> near the end of your pages under JS Nova to enable it.

            
              <script src="../../assets/js/components/hs.google-geo-chart.js"></script>
            
          

Copy-paste the init function under JS Plugins Init., before the closing </body> tag, to enable it.

            
              <script>
                $(document).on('ready', function () {
                  // initialization of geo map
                  $.HSCore.components.HSGoogleGeoChart.init('#map');
                });
              </script>
            
          

Basic example

                  
                    <!-- File Attach -->
                    <div class="position-relative embed-responsive embed-responsive-21by9">
                      <div id="map" class="position-absolute w-100 h-100" style="top: 0;"
                           data-api-key="AIzaSyAOLYM76-S8-pL-_OUrZAax2cQAtJjEQCg"
                           data-data='[["Country", "Statistics"]]'></div>
                    </div>
                    <!-- End File Attach -->
                  
                

JavaScript behavior

Methods

Options can be passed via data attributes or JavaScript. For data attributes, append the option name to data-, as in data-api-key="".