Just elaborate more using this function map.addOverlay(createMarkerforimage(latlng, file ,info));
var latlng = new GLatLng(southWest.lat() + latSpan * 0.58,southWest.lng() + lngSpan * 0.6);
info = {wind_information} ;
file = {wind_direction_from}{wind_direction_to}.png;
$weather_information="Weather:".$weather_i.' Temp :'.$temp.' Humidity:'.$humidity.' Warning:'.$warning;
and now problem is in passing warning value which is in text i.e. rainy,stormy,windy etc.through mysql data base server.But when English language is selected for display of text on overlay its showing English fonts.But other then English its not showing,When I am entering unicode of other language Hindi which is storing in database server mysql instead of showing Hindi fonts its displaying unicode of corresponding language.Has anybody any Idea why its showing unicode of language other then English.
Below is code for Map Display+Weather Information.
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<body>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAPYT78Azii9ZqwLmlU2VQJhRU9Gu0987DUr62vY-zxjVyLCj4-BQG5ZPkezsKN1U1e5L247vqxgFEDg"
type="text/javascript"></script>
<script type="text/javascript">
function display_info(info)
{
var theNode = document.getElementById("infobold");
var tNode = theNode.childNodes[0];
tNode.nodeValue = info;
};
function initialize()
{
alert('prabhat');
if (GBrowserIsCompatible())
{
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng({latitude}, {langitude}), {zoom});
map.addControl(new GSmallMapControl());
{satellite_str}
{satellite_zoom}
var bounds = map.getBounds();
var southWest = bounds.getSouthWest();
var northEast = bounds.getNorthEast();
var lngSpan = northEast.lng() - southWest.lng();
var latSpan = northEast.lat() - southWest.lat();
function createMarker(point,file ,info)
{
// Create a lettered icon for this point using our icon class
var baseIcon = new GIcon();
baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(34, 34);
baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);
var letteredIcon = new GIcon(baseIcon);
letteredIcon.image = file;
markerOptions = { icon:letteredIcon };
var marker = new GMarker(point, markerOptions);
{display_str}
return marker;
}
function createMarkerforimage(point,file ,info)
{
// overlays text on maps using image from image.php
var baseIcon = new GIcon();
//baseIcon.shadow = "http://www.google.com/mapfiles/shadow50.png";
baseIcon.iconSize = new GSize(70, 34);
//baseIcon.shadowSize = new GSize(37, 34);
baseIcon.iconAnchor = new GPoint(9, 34);
baseIcon.infoWindowAnchor = new GPoint(9, 2);
baseIcon.infoShadowAnchor = new GPoint(18, 25);
var letteredIcon = new GIcon(baseIcon);
letteredIcon.image = file;
markerOptions = { icon:letteredIcon };
var marker = new GMarker(point, markerOptions);
{display_str}
return marker;
}
var latlng = new GLatLng(northEast.lat() - latSpan * 0.2,northEast.lng() - lngSpan * 0.1);
info = {weather_information};
file = {weather}.png ;
map.addOverlay(createMarker(latlng, file ,info));
var latlng = new GLatLng(northEast.lat() - latSpan * 0.4,northEast.lng() - lngSpan * 0.1);
info = {fish_info};
file = {fish}.png;
map.addOverlay(createMarker(latlng,file,info));
var latlng = new GLatLng(southWest.lat() + latSpan * 0.5,southWest.lng() + lngSpan * 0.6);
info = {wind_information} ;
file = {wind_direction_from}{wind_direction_to}.png;
map.addOverlay(createMarker(latlng, file ,info));
var latlng = new GLatLng(southWest.lat() + latSpan * 0.58,southWest.lng() + lngSpan * 0.6);
info = {wind_information} ;
file = {wind_direction_from}{wind_direction_to}.png;
map.addOverlay(createMarker(latlng, file ,info));
latlng = new GLatLng(southWest.lat() + latSpan * 0.55,southWest.lng() + lngSpan * 0.45);
file = "image.php?wind_speed={windinfo_speed}";
map.addOverlay(createMarkerforimage(latlng, file ,info));
}
}
</script>
</head>
{info}
{file}
{width}
{height}
<body onload="initialize()" onunload="GUnload()">
<table width="60%"border="0" cellpadding="0" cellspacing="0" align="center">
<tr>
<td colspan="2"><div id="map_canvas" style="width: {width}px; height: {height}px" align="center"></div>
<div align="center"><h2>Weather information</h2></div> </td>
</tr>
<tr>
<td>
<table width="50%" border="0" cellpadding="0" cellspacing="5" align="center">
{form}
Recent comments
8 hours 39 min ago
13 hours 31 min ago
22 hours 23 min ago
23 hours 23 min ago
1 day 3 hours ago
1 day 4 hours ago
1 day 8 hours ago
1 day 15 hours ago
2 days 9 min ago
2 days 1 hour ago