• Resolved Moritz83

    (@moritz83)


    Hi,

    ich created a Google map using a generator and I would like to insert it on a custom page. I tried to insert his in the “Text” area when you edit a page but without success.
    The code itself is working fine, tried it with a WYSIWYG editor and it will show the map correctly.

    This is the code:

    <script type='text/javascript' src='https://www.google.com/jsapi'></script>
    <script type='text/javascript'>google.load('visualization', '1', {'packages': ['geochart']});
    google.setOnLoadCallback(drawVisualization);
    
      function drawVisualization() {var data = new google.visualization.DataTable();
    
     data.addColumn('string', 'Country');
     data.addColumn('number', 'Value');
     data.addColumn({type:'string', role:'tooltip'});var ivalue = new Array();
    
     data.addRows([[{v:'New York',f:'New York'},0,'']]);
     ivalue['New York'] = '';
    
     data.addRows([[{v:'Washington D.C.',f:'Washington D.C.'},1,'']]);
     ivalue['Washington D.C.'] = '';
    
     data.addRows([[{v:'San Francisco',f:'San Francisco'},2,'']]);
     ivalue['San Francisco'] = '';
    
     data.addRows([[{v:'Los Angeles',f:'Los Angeles'},3,'']]);
     ivalue['Los Angeles'] = '';
    
     data.addRows([[{v:'Las Vegas',f:'Las Vegas'},4,'']]);
     ivalue['Las Vegas'] = '';
    
     var options = {
     backgroundColor: {fill:'',stroke:'#FFFFFF' ,strokeWidth:0 },
     colorAxis:  {minValue: 0, maxValue: 4,  colors: ['#0011FF','#0011FF','#0011FF','0011FF','0011FF',]},
     legend: 'none',
     backgroundColor: {fill:'',stroke:'#FFFFFF' ,strokeWidth:0 },
     datalessRegionColor: '#f5f5f5',
     displayMode: 'markers',
     enableRegionInteractivity: 'false',
     resolution: 'provinces',
     sizeAxis: {minValue: 1, maxValue:1,minSize:4,  maxSize: 4},
     region:'US',
     keepAspectRatio: true,
     width:600,
     height:400,
     tooltip: {textStyle: {color: '#444444'}, trigger:'focus'}
     };
      var chart = new google.visualization.GeoChart(document.getElementById('visualization'));
     chart.draw(data, options);
     }
     </script>
     <div id='visualization'></div>

    Any idea?

    Thanks in advance
    Moritz

Viewing 1 replies (of 1 total)
  • Thread Starter Moritz83

    (@moritz83)

    Well solved it.

    Created a separate page template for each map and inserted it into the header part.

Viewing 1 replies (of 1 total)
  • The topic ‘Insert JavaScript’ is closed to new replies.