最近在研究怎麼在網頁版的google map 中實現類似flash 的效果,本來google map 是有自己的flash 版的,但是現在Flash V2版的還是需要Key 的,但是現在google官網是沒法申請key 了,所以只好自己想辦法。
我想實現的效果就是這兩個輸入框中,用戶輸入時間,把這兩個時間點的數據以marker 的形式標記在地圖上,不是一次性全部顯示,而是以天爲單位能看到地圖上的marker是變化的。
思路是:延時循環查詢、顯示
在javascript 中setTimeout() 方法用於在指定的毫秒數後調用函數或計算表達式。
語法
setTimeout(code,millisec)參數描述:
code必需。要調用的函數後要執行的 JavaScript 代碼串。
millisec必需。在執行代碼前需等待的毫秒數。
一些例子:
http://blog.163.com/fan_yishan/blog/static/476922132007112185942663/
http://developer.51cto.com/art/201106/268637.htm
那回到自己的程序:
function rapidChange()
{
markers.length=0;
var sel=document.getElementById("searchty");
type = sel.options[sel.selectedIndex].value;
var sev=document.getElementById("searchlo");
state = sev.options[sev.selectedIndex].value;
var name_add= name_address(state);
var time1=document.getElementById("searchti1");
var time2=document.getElementById("searchti2");
//var year = time.options[time.selectedIndex].value;
var year1=time1.value;
var year2=time2.value;
var d1 = new Date(year1.replace(/\-/g, "/"));
var d2 = new Date(year2.replace(/\-/g, "/"));
var getOffDays = function(startDate, endDate) {
//得到時間戳相減 得到以毫秒爲單位的差
var mmSec = (endDate.getTime() - startDate.getTime());
//單位轉換爲天並返回
return (mmSec / 3600000 / 24);
};
var p=getOffDays(d1,d2);
var Ti;
if(m<=p){
Ti=year1;
var arr = Ti.split("-");
var newdt = new Date(Number(arr[0]),Number(arr[1]),Number(arr[2]));
var month;
var day;
if(newdt.getMonth()<10){
month="0"+newdt.getMonth();
}
if(newdt.getDate()+(m)<10){
day="0"+(newdt.getDate()+(m));
}else{
day=newdt.getDate()+(m);
}
var repnewdt = newdt.getFullYear() + "-" + month + "-" + day;
var url = "forecastSearch.php?type=" + escape(type) + "&location=" + escape(name_add)+"&year=" + escape(repnewdt);//中文的時候使用
url=url+"&sid="+Math.random();
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null) {
alert("Browser does not support HTTP Request");
return;
}
xmlHttp.open("GET",url,true);
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.send(null);
m=m+1;
setTimeout('rapidChange()',4000);
}
}
首先計算出兩個時間的差值
var p=getOffDays(d1,d2);
然後對要查詢的時間進行+1 ,在調用setTimeout函數