I am trying to re create a google heat-map in wps. I managed to have it on a web form but I cannot use any web application only wpf.
How can I inject the code below into a browser control and also passing data from a server side method
<script>
var map, heatmap;
function initMap() {
var CenterLat = 56.816918399;
var CenterLong = -4.1826492694;
var ArrMarkers = [];
var ServerData =<%=GetJsonData(); %>;
var Latitude;
var Longitude;
for (var i = 0; i < ServerData.length; i++) {
Latitude = ServerData[i].Latitude;
Longitude = ServerData[i].Longitude;
var marker = { location: new google.maps.LatLng(Latitude, Longitude) };
ArrMarkers.push(marker);
}
var mapCoordinates = {
center: new google.maps.LatLng(CenterLat, CenterLong),
zoom: 7,
mapTypeId: 'satellite'
};
map = new google.maps.Map(document.getElementById('map'), mapCoordinates);
heatmap = new google.maps.visualization.HeatmapLayer({
data: ArrMarkers,
radius: 15,
opacity: 0.5,
map: map
});
}//end InitMap
function toggleHeatmap() {
heatmap.setMap(heatmap.getMap() ? null : map);
}
</script>
<script type="text/javascript" async defer src="<%=GetJavaScriptUrl()%>">
</script>
So the first script is what google need to produce a staic map with an overlay and the second script is the google API url which also contains the google API key