超图使用javascript在地图上标记点,点击时并弹出窗口

-------在地图上添加一个标记,点击标记时。弹出窗口显示相应的信息。------
function addFeature(arr){//在显示标记的图层里添加元素
 
    var marker;
    for (j=0; j<arr.length; j++) {
          // var f = vectorLayer.features[j];
           var point = new SuperMap.Geometry.Point(arr[j]["站点经度"],arr[j]["站点纬度"]),
               size = new SuperMap.Size(44, 33),
                    offset = new SuperMap.Pixel(-(size.w/2), -size.h),
                    icon = new SuperMap.Icon("resource/controlImages/marker.png", size, offset);
          
          
           marker = new SuperMap.Marker(new SuperMap.LonLat(point.x, point.y), icon);
           marker.M_RAINSTATION = arr[j];
           marker.events.on({//注册点击事件的处理方法
               "click":openInfoWin,
               "scope": marker
           });
           markerLayer.addMarker(marker);
       }
    
}
//弹出的窗口
var infowin = null;
function openInfoWin(){ //打开窗体
    closeInfoWin();//关闭之前打开的窗口。
    var marker = this;
    var lonlat = marker.lonlat;
    var rainObj=marker.M_RAINSTATION;
    var contentHTML = "<div style='font-size:.8em; opacity: 0.8; overflow-y:hidden;'>";
    contentHTML += "<div>" +"站点编号:"+rainObj["站点编号"]+ "<br>站点名称:"
          +rainObj["站点名称"]+"<br> 降雨量:"
          +rainObj["实时雨情"]+ "<br> 时间:"
          +rainObj["更新时间"]+ "<br> 站点纬度:"
          +rainObj["站点纬度"]+ "<br> 站点经度:"
          +rainObj["站点经度"]+ "<br> 所属单位:"
          +rainObj["单位"]+"</div></div>";
    var size = new SuperMap.Size(0, 33);
    var offset = new SuperMap.Pixel(0, -size.h);
    var icon = new SuperMap.Icon("resource/controlImages/marker.png", size, offset);
    var popup = new SuperMap.Popup.FramedCloud("popwin",
        new SuperMap.LonLat(lonlat.lon,lonlat.lat),
        null,
        contentHTML,
        icon,
        true);

    infowin = popup;
    map.addPopup(popup);
}

function closeInfoWin(){//关闭窗口
    if(infowin){
        try{
            infowin.hide();//隐藏窗体对象
            infowin.destroy();//消毁窗体对象
        }
        catch(e){}
    }
}

//--------------在地图上画点------------------//

//在地图上画出一个点。
for(var i=0;i<arr.length;i++){
  //构造geometry对象
     var point = new SuperMap.Geometry.Point(arr[i]["站点经度"],arr[i]["站点纬

度"]);
   //构建覆盖物对象
     var pointVector = new SuperMap.Feature.Vector(point);
     pointVector.attributes.RAINSTATION=arr[i];
   //修改点样式红色
     pointVector.style = {fillColor: "red",strokeColor: "yellow",pointRadius:0};
     
     //添加矢量图形覆盖物
     vectorLayer.addFeatures(pointVector);
}

 

你可能感兴趣的:(超图使用javascript在地图上标记点,点击时并弹出窗口)