天地图加marker和popup

//-----------------加marker-----------------------------

 

var Layer = new GeoSurf.Layer.Markers("MarkerLayer");
 map.addLayer(Layer);

 

var markerIcon = new GeoSurf.Icon();

markerIcon.url = "icon/star.gif";

markerIcon.size = new GeoSurf.Size(18,18);

 

var lonlat = new GeoSurf.LonLat(116.4, 30.4);

 

var marker = new GeoSurf.Marker(lonlat, markerIcon);

 

map.addLayer(Layer);
Layer.addMarker(marker);

 

//---------------给marker加popup--------------------------

 

marker.events.register("mousedown", marker, function(){
      var contentHTML ="<div>" +
                                   "纬度:" + Lat + "°" +
                                    "经度:" + Lon + "°" +
                                   "<//div>";
      var popup = new GeoSurf.Popup("chicken",lonlat,new GeoSurf.Size(200,200),contentHTML,true);
      popup.closeOnMove = true;
      map.addPopup(popup);
     });

转载于:https://www.cnblogs.com/zhang88lei/archive/2010/12/24/3244102.html

### 实现天地图中的自定义图标 Marker 为了在天地图 API 中设置 marker 使用自定义图标,可以通过创建 `T.Map` 对象并利用 `T.Marker` 来添带有特定图标的标记。具体来说,在初始化地图之后,通过指定一个图像 URL 配置项来自定义 marker 的外观。 下面是一个完整的例子展示如何实现这一功能: #### 初始化地图实例 首先需要引入必要的库文件,并且初始化 TDT 地图对象[^2]。 ```html <script type="text/javascript" src="https://api.tianditu.gov.cn/api?v=4.0&tk=您的密钥"></script> <div id="mapContainer" style="width:100%;height:500px;"></div> ``` #### 创建具有自定义图标的 Marker 并放置到地图上 接着编写 JavaScript 代码片段用于创建一个新的 marker,并为其分配一张图片作为显示样式。 ```javascript // 定义地图中心位置 var center = new T.LngLat(116.40789, 39.9042); // 初始化地图容器 var map = new T.Map('mapContainer'); map.centerAndZoom(center, 15); // 设置缩放级别控件 map.addControl(new T.Zoom()); // 载矢量瓦片图层 var vecLayer = new T.TileLayer('vec_c', { }); map.addTileLayer(vecLayer); var cvaLayer = new T.TileLayer('cva_c',{}); map.addTileLayer(cvaLayer); // 构建自定义 icon 图像 var myIcon = new T.Icon({ iconUrl: 'http://example.com/path/to/icon.png', iconSize: [38, 38], // 尺寸大小可以根据实际需求调整 }); // 添带自定义 Icon 的 Marker 到地图中 var marker = new T.Marker(center, { icon: myIcon, }); map.addOverLay(marker); ``` 上述代码展示了怎样天地图服务以及如何向其中入拥有个性化样式的定位点。这里的关键在于使用 `T.Icon()` 方法传入想要使用的图标路径及其尺寸参数,再将其赋值给 `T.Marker()` 函数内的 `icon` 属性即可完成定制化操作。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值