php - Diplaying a javascript map (amChart) in a Ghost post

871

I am trying to add a amChart map to one of my post on Ghost but it doesn't appear to work. I tested the code in PHP and it works just fine.

<script src="http://www.amcharts.com/lib/3/ammap.js" type="text/javascript"></script>
<script src="http://www.amcharts.com/lib/3/maps/js/worldHigh.js" type="text/javascript"></script>
<div id="mapdiv" class="page_speed_260857938" align="center"></div>
<script type="text/javascript">

var map;

AmCharts.ready(function() {

map                 =new AmCharts.AmMap();

map.pathToImages    ="http://www.amcharts.com/lib/3/images/";

map.panEventsEnabled=true;

map.backgroundColor ="#FFFFFF";

map.backgroundAlpha =1;

map.zoomControl.buttonFillColor = "#5EB7DE";

map.zoomControl.buttonRollOverColor = "#88CAE7";

map.zoomControl.panControlEnabled =false;

map.zoomControl.zoomControlEnabled=true;



var dataProvider    ={

mapVar          : AmCharts.maps.worldHigh,

getAreasFromMap : true,

areas           : [

{ id: 'AT', showAsSelected: true },

{ id: 'FR', showAsSelected: true },

{ id: 'DE', showAsSelected: true },

{ id: 'GR', showAsSelected: true },

{ id: 'IT', showAsSelected: true },

{ id: 'NL', showAsSelected: true },

{ id: 'PT', showAsSelected: true },

{ id: 'ES', showAsSelected: true },

{ id: 'CH', showAsSelected: true },

{ id: 'TR', showAsSelected: true },

{ id: 'GB', showAsSelected: true },

{ id: 'US', showAsSelected: true },

{ id: 'MW', showAsSelected: true },

{ id: 'MA', showAsSelected: true },

{ id: 'MT', showAsSelected: true }

]

};



map.dataProvider    =dataProvider;



map.areasSettings   ={

autoZoom             : false,

color                : "#CDCDCD",

colorSolid           : "#5EB7DE",

selectedColor        : "#5EB7DE",

outlineColor         : "#666666",

rollOverColor        : "#88CAE7",

rollOverOutlineColor : "#666666"

};



map.write("mapdiv");

});

</script>

It should look something like this:

amChart map

What am I doing wrong? Other JS appears to work fine.

People are also looking for solutions to the problem: how to pick dynamic textbox values created by javascript in php

Source

Didn't find the answer?

Our community is visited by hundreds of web development professionals every day. Ask your question and get a quick answer for free.

Ask a Question

Write quick answer

Do you know the answer to this question? Write a quick response to it. With your help, we will make our community stronger.

Similar questions

Find the answer in similar questions on our website.