天下之事,必先处之难,而后易之。

指定地图图标在视野范围内移动

前言:地图图标移动过程中要求可见,下面针对三种地图给出实例。

运用:GPS轨迹播放。
1、Google地图:
function calculateToView(latlng){
   var bounds=map.getBounds();
   //不在bounds之内则做相应的处理
   if(!bounds.contains(latlng)){
      var ne=bounds.getNorthEast(),sw=bounds.getSouthWest();
       var northEastX=ne.x,northEastY=ne.y,southWestX=sw.x,southWestY=sw.y;
       var center=map.getCenter();
       var lng=center.lng(),lat=center.lat();
       var px=latlng.lng(),py=latlng.lat();
       if(px<=southWestX){//出左边界
          var minusRt=southWestX-px;
          center=new google.maps.LatLng(lat,lng-minusRt);
       }else if(px>=northEastX){//出右边界
          var minusRt=px-northEastX;
          center=new google.maps.LatLng(lat,lng+minusRt);
       }else if(py>=northEastY){//出上边界
          var minusRt=py-northEastY;
          center=new google.maps.LatLng(lat+minusRt,lng);
       }else if(py<=southWestY){//出下边界
          var minusRt=southWestY-py;
          center=new google.maps.LatLng(lat-minusRt,lng);
       }
       map.panTo(center);
   }
}
2、OpenLayers地图:
function calculateToView(lonlat){
   var bounds=map.getExtent();
   //不在bounds之内则做相应的处理
   if(!bounds.containsLonLat(lonlat)){
       var northEastX=bounds.right,northEastY=bounds.top,southWestX=bounds.left,southWestY=bounds.bottom;
       var center=map.getCenter();
       var lon=center.lon,lat=center.lat;
       var px=latlng.lon,py=latlng.lat;
       if(px<=southWestX){//出左边界
          var minusRt=southWestX-px;
          center=new OpenLayers.LonLat(lon-minusRt,lat);
       }else if(px>=northEastX){//出右边界
          var minusRt=px-northEastX;
          center=new OpenLayers.LonLat(lon+minusRt,lat);
       }else if(py>=northEastY){//出上边界
          var minusRt=py-northEastY;
          center=new OpenLayers.LonLat(lon,lat+minusRt);
       }else if(py<=southWestY){//出下边界
          var minusRt=southWestY-py;
          center=new OpenLayers.LonLat(lon,lat-minusRt);
       }
       map.panTo(center);
   }
}
3、ALiYun(阿里云地图):
function calculateToView(latlng){
   var bounds=map.getBounds();
   //不在bounds之内则做相应的处理
   if(!bounds.containsLatLng(latlng)){
       var ne=bounds.getNorthEast(),sw=bounds.getSouthWest();
       var northEastX=ne.x,northEastY=ne.y,southWestX=sw.x,southWestY=sw.y;
       var center=map.getCenter();
       var lng=center.lng(),lat=center.lat();
       var px=latlng.lng(),py=latlng.lat();
       if(px<=southWestX){//出左边界
          var minusRt=southWestX-px;
          center=new AliLatLng(lat,lng-minusRt);
       }else if(px>=northEastX){//出右边界
          var minusRt=px-northEastX;
          center=new AliLatLng(lat,lng+minusRt);
       }else if(py>=northEastY){//出上边界
          var minusRt=py-northEastY;
          center=new AliLatLng(lat+minusRt,lng);
       }else if(py<=southWestY){//出下边界
          var minusRt=southWestY-py;
          center=new AliLatLng(lat-minusRt,lng);
       }
       map.panTo(center);
   }
}

注:所传参数均为经纬度坐标。

posted @ 2012-05-21 19:51  boonya  阅读(398)  评论(0编辑  收藏  举报
我有佳人隔窗而居,今有伊人明月之畔。
轻歌柔情冰壶之浣,涓涓清流梦入云端。
美人如娇温雅悠婉,目遇赏阅适而自欣。
百草层叠疏而有致,此情此思怀彼佳人。
念所思之唯心叩之,踽踽彳亍寤寐思之。
行云如风逝而复归,佳人一去莫知可回?
深闺冷瘦独自徘徊,处处明灯影还如只。
推窗见月疑是归人,阑珊灯火托手思忖。
庐居闲客而好品茗,斟茶徐徐漫漫生烟。

我有佳人在水之畔,瓮载渔舟浣纱归还。
明月相照月色还低,浅近芦苇深深如钿。
庐山秋月如美人衣,画堂春阁香气靡靡。
秋意幽笃残粉摇曳,轻轻如诉画中蝴蝶。
泾水潺潺取尔浇园,暮色黄昏如沐佳人。
青丝撩弄长裙翩翩,彩蝶飞舞执子手腕。
香带丝缕缓缓在肩,柔美体肤寸寸爱怜。
如水之殇美玉成欢,我有佳人清新如兰。
伊人在水我在一边,远远相望不可亵玩。