📄 gmap.html
字号:
<!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">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps API Example: Simple Geocoding</title>
<script src="http://maps.google.com/maps?file=api&v=2.x&key=ABQIAAAAzr2EBOXUKnm_jVnk0OJI7xSosDVG8KKPE1-m51RBrvYughuyMxQ-i1QfUnH94QxWIa6N4U6MouMmBA" type="text/javascript"></script>
<script type="text/javascript">
var map = null;
var geocoder = null;
var bounds = null;
var lati = null;
var longi = null;
var nameOut = null;
var outID = null;
var found = "found";
var arrOutlets = new Array();
var arrMarks = new Array();
var idArray = new Array();
var nameArray = new Array();
var clickedCount = 0;
var routeItems = 0;
var geoCodeArray = new Array();
function initialize()
{
if (GBrowserIsCompatible())
{
map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(-25.998610668442662 , 130.110553458785), 4);
//map.setCenter(new GLatLng(-33.9207049 , 151.142345), 11);
map.addControl(new GLargeMapControl());
geocoder = new GClientGeocoder();
bounds = map.getBounds();
}
}
function refreshPage()
{
window.location.reload(true);
}
/*var searchMarker;
function searchIs(searchAd)
{
if(geocoder)
{
geocoder.getLatLng(searchAd,
function(point)
{
if(!point)
{
alert(searchAd+" not found");
}
else
{
searchMarker = new GMarker(point,{clickable:true });
GEvent.addListener(searchMarker,"click", function()
{
searchMarker.openInfoWindowHtml(searchAd+"<br/>Latitude: "+point.lat()+"<br/>Longitude: "+ point.lng());
});
}
map.addOverlay(searchMarker);
searchMarker.openInfoWindowHtml(searchAd+"<br/>"+point.lat()+" & "+ point.lng());
});
}
}*/
function showAddress(address,stAd,id)
{
if (geocoder)
{
geocoder.getLatLng(
address,
function(point)
{
if (!point)
{
//alert(address + " not found");
found = "not";
geocoder.getLatLng(
stAd,
function(point)
{
if(!point)
{}
else if(!bounds.containsLatLng(point))
{}
else
{
found = "found";
lati = point.lat();
longi = point.lng();
nameOut = address;
outID = id;
var marker = new GMarker(point,{clickable:true });
GEvent.addListener(marker,"click", function() {
for(var k=0; k < arrOutlets.length ; k++)
{
//alert("the outlet "+k +" is "+arrOutlets[k].name);
if(arrOutlets[k].latitude == point.lat() && arrOutlets[k].longitude == point.lng() )
{
marker.openInfoWindowHtml(arrOutlets[k].name);
break;
}
}
});
map.addOverlay(marker);
//alert(address + " found");
marker.openInfoWindowHtml(address+"<br/>"+point.lat()+" & "+ point.lng());
}
}
);
}
else if(!bounds.containsLatLng(point))
{
alert(address + " is not in the bound " + point);
found = "not";
geocoder.getLatLng(
stAd,
function(point)
{
if(!point)
{}
else if(!bounds.containsLatLng(point))
{}
else
{
found = "found";
lati = point.lat();
longi = point.lng();
nameOut = address;
outID = id;
var marker = new GMarker(point,{clickable:true });
GEvent.addListener(marker,"click", function() {
for(var k=0; k < arrOutlets.length ; k++)
{
//alert("the outlet "+k +" is "+arrOutlets[k].name);
if(arrOutlets[k].latitude == point.lat() && arrOutlets[k].longitude == point.lng() )
{
marker.openInfoWindowHtml(arrOutlets[k].name);
break;
}
}
});
map.addOverlay(marker);
//alert(address + " found");
marker.openInfoWindowHtml(address+"<br/>"+point.lat()+" & "+ point.lng());
}
}
);
}
else
{
// map.setCenter(point, 13);
found = "found";
lati = point.lat();
longi = point.lng();
nameOut = address;
outID = id;
var marker = new GMarker(point,{clickable:true });
GEvent.addListener(marker,"click", function() {
for(var k=0; k < arrOutlets.length ; k++)
{
//alert("the outlet "+k +" is "+arrOutlets[k].name);
if(arrOutlets[k].latitude == point.lat() && arrOutlets[k].longitude == point.lng() )
{
marker.openInfoWindowHtml(arrOutlets[k].name);
break;
}
}
});
map.addOverlay(marker);
//alert(address + " found");
marker.openInfoWindowHtml(address+"<br/>"+point.lat()+" & "+ point.lng());
}
}
);
}
return address;
}
function setGivenPoints()
{
var latestBound = map.getBounds();
var outletIndex = 0;
arrMarks = new Array(arrOutlets.length);
for(outletIndex = 0 ; outletIndex < arrOutlets.length ; outletIndex++)
{
var outPoint = new GLatLng(arrOutlets[outletIndex].latitude, arrOutlets[outletIndex].longitude);
arrMarks[outletIndex] = new GMarker(new GLatLng(arrOutlets[outletIndex].latitude, arrOutlets[outletIndex].longitude),{clickable:true , color:"black"});
if(latestBound.containsLatLng(outPoint))
{
setthelistener(arrMarks[outletIndex],arrOutlets[outletIndex]);
map.addOverlay(arrMarks[outletIndex]);
}
}
}
function setthelistener(mark,inOutlet)
{
GEvent.addListener(mark,"mouseover",function(){
mark.openInfoWindowHtml("<b>"+inOutlet.name+"("+inOutlet.id+")</b> </br>Address : "+inOutlet.addressSt+" "+inOutlet.city+" </br>Class : "+inOutlet.classID+"</br> TP: "+inOutlet.tp1+"</br>Fax: "+inOutlet.fax+"</br>Better to Call: "+inOutlet.outcall+"</br><b>Sales Rep- </b><br/> Name: "+inOutlet.repName +"("+inOutlet.repDesignation+")"+"<br/> TP: "+inOutlet.repTP,{pixelOffset:new GSize(32,8), maxWidth:540});
});
GEvent.addListener(mark,"click",function(){
addToSelected(inOutlet.id,inOutlet.name);
//var myIcon = new GIcon(G_DEFAULT_ICON, "mymarker.png");
mark.setImage("markerBlue.png");
});
}
function addToSelected(clickedid, clickedname)
{
idArray[clickedCount] = clickedid;
nameArray[clickedCount] = clickedname;
clickedCount++;
}
function returnIdArray()
{
var idConcat=idArray[0];
for(var iid=1; iid<idArray.length; iid++)
{
idConcat = idConcat+","+idArray[iid];
}
return idConcat;
}
function returnNameArray()
{
var nameConcat=nameArray[0];
for(var iname=1; iname<nameArray.length; iname++)
{
nameConcat = nameConcat+","+nameArray[iname];
//alert(nameConcat);
}
return nameConcat;
}
function collectList(outletNameToRoute)
{
nameArray[routeItems] = outletNameToRoute;
for(var intForTakeLatLng = 0; intForTakeLatLng< arrOutlets.length; intForTakeLatLng++)
{
if(nameArray[routeItems] == arrOutlets[intForTakeLatLng].name)
{
geoCodeArray[routeItems] = new GLatLng(arrOutlets[intForTakeLatLng].latitude,arrOutlets[intForTakeLatLng].longitude);
}
}
routeItems++;
}
var gdIn = 0;
var gdArray=new Array();
var gd;
function drawTheRoute()
{
gd = new GDirections(map);
gd.loadFromWaypoints(geoCodeArray,{travelMode:G_TRAVEL_MODE_DRIVING, getPolyline:false, getSteps:false, preserveViewpoint:false});
gd.clear();
GEvent.addListener(gd,"load", onGdicLoad);
GEvent.addListener(gd,"error",errorHandleRoute);
routeItems = 0;
gdIn++;
}
//var cleanVar;
var theTimes = 0;
function drawTheShortest()
{
var shortest = new GDirections(map);
//cleanVar = true;
//cleanVar = false;
shortest.clear();
shortest.loadFromWaypoints(geoCodeArray,{travelMode:G_TRAVEL_MODE_DRIVING, getPolyline:true, getSteps:false, preserveViewpoint:true});
GEvent.addListener(shortest,"load",function(){polyLines(shortest)});
}
function polyLines(getShortIs)
{
var thePoly = getShortIs.getPolyline();
if(theTimes==1)
{
thePoly.color="#990000";
thePoly.redraw();
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -