soso map(1)

来源：互联网发布：下载2012新软件编辑：程序博客网时间：2024/05/17 03:58
8月15日有点迷糊，弄个soso map都弄半天！唉。。。这个功能不错！！！好好弄，明天继续来！！！
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>SOSOMap</title><style type="text/css">        body, button, input, select, textarea {          font: 12px/16px Verdana, Helvetica, Arial, sans-serif;        }    </style><script charset="utf-8" src="http://api.map.soso.com/v1.0/main.js"></script><script>    var map,        info,        station_markers = [],        station_labels = [],        stations_id = [],        searchService = new soso.maps.SearchService(),        stationService = new soso.maps.StationService();    function init() {        map = new soso.maps.Map(document.getElementById("container"), {            // 地图的中心地理坐标。            center: new soso.maps.LatLng(39.916527,116.397128)        });        searchKeyword();    }        //清除地图上的marker    function clearOverlays(overlays){        var overlay;        while(overlay = overlays.pop()){            overlay.setMap(null);        }    }        function searchKeyword() {            var keyword = document.getElementById("keyword").value;            var region = document.getElementById("region").value;            var request = {                keyword: keyword,                region:region,                searchMode:soso.maps.SearchMode.BUS            }              var latlngBounds = new soso.maps.LatLngBounds();            info = new soso.maps.InfoWindow({map: map,zIndex:20});            searchService.search(request, function(response, status) {                  if (status == soso.maps.SearchStatus.OK) {                        clearOverlays(station_markers);                        var pois = response.pois;                        var info_html = [];                            for(var i = 0,l = pois.length;i < l; i++){                            if(i<5){ //显示前五个                                var poi = pois[i];                                latlngBounds.extend(poi.latLng);                                                                var marker = new soso.maps.Marker({                                    map:map,                                    position: poi.latLng                                });                                                                var decor = new soso.maps.MarkerDecoration({                                    content: i+1,                                    margin: new soso.maps.Size(0, -4),                                    align: soso.maps.ALIGN.CENTER,                                    marker: marker                                });                                    (function(marker,station_id){                                    soso.maps.Event.addListener(marker, 'click', function() {                                         var request = {                                             stationId:station_id                                         }                                         //站点详情                                         stationService.detail(request,function(response,status){                                                var station = response;                                                var via_line = [];                                                for(var j=0;j<station.lines.length;j++){                                                    via_line.push(station.lines[j].name)                                                }                                                                 info.open('<div style="width:280px;">'                                                  +'站点ID：'+station.id                                                  +'<br>站点名称：'+station.name                                                  +'<br>途经线路：'+via_line.join(',')                                                   +'</div>',                                                  marker);                                         });                                                                                                });                                })(marker,poi.id);                                station_markers.push(marker);                                                                var station_type                                poi.type == soso.maps.PoiType.BUS_STATION && (station_type = '公交车站');                                poi.type == soso.maps.PoiType.SUBWAY_STATION && (station_type = '地铁站');                                                                info_html.push('<div><b>'+(i+1)+".</b>"+poi.name+' - '+station_type+'</div>');                            }                        }                        map.fitBounds(latlngBounds);                        document.getElementById('infos_div').innerHTML = info_html.join('');                   } else {                        alert("检索没有结果，原因: " + status);                   }            });    }    </script></head><body onLoad="init();"><div style='margin:5px 0px'> <b>路点名称: </b>  <select id="region">    <option value="北京">北京</option>  </select>  <input id="keyword" style="width:50px" type="textbox" value="中关村">  <input type="button" value="检索" onClick="searchKeyword()">  (单击标记显示站点详情信息) </div><div style="width:580px;height:300px" id="container"></div><div style="width:580px;padding-top:5px" id="infos_div"></div></body></html>