百度的离线地图开发。地图的标记怎么实现的?求帮助~!
下面是js的引用,不行的。地图可以查看。但是标记出不来。求救啊。搞了一天了
var map = new BMap.Map("container",{mapType: BMAP_NORMAL_MAP}); //设置卫星图为底图
var point = new BMap.Point(121.46950,31.22643); // 创建点坐标
map.centerAndZoom(point,14); // 初始化地图,设置中心点坐标和地图级别。
//map.addControl(new BMap.MapTypeControl());
map.addControl(new BMap.NavigationControl());
map.enableScrollWheelZoom(); // 启用滚轮放大缩小。
map.enableKeyboard(); // 启用键盘操作。
map.setCurrentCity("上海"); // 设置地图显示的城市 此项是必须设置的
//标注点数组
var markerArr = [{title:"目前位置",content:"我的备注",point:"121.46950"+"|"+"31.22643",isOpen:0,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}}
];
//alert(document.cookie.split(";")[1].split("-")[0]+"|"+document.cookie.split(";")[1].split("-")[1].split("=")[0]);
//创建marker
function addMarker(){
for(var i=0;i<markerArr.length;i++){
var json = markerArr[i];
var p0 = json.point.split("|")[0];
var p1 = json.point.split("|")[1];
var point = new BMap.Point(p0,p1);
var iconImg = createIcon(json.icon);
var marker = new BMap.Marker(point,{icon:iconImg});
var iw = createInfoWindow(i);
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
alert(label);
marker.setLabel(label);
map.addOverlay(marker);
label.setStyle({
borderColor:"#808080",
color:"#333",
cursor:"pointer"
});
(function(){
alert("createInfoWindow");
var index = i;
var _iw = createInfoWindow(i);
var _marker = marker;
_marker.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
});
_iw.addEventListener("open",function(){
_marker.getLabel().hide();
})
_iw.addEventListener("close",function(){
_marker.getLabel().show();
})
label.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
})
alert(!!json.isOpen);
if(!!json.isOpen){
label.hide();
_marker.openInfoWindow(_iw);
}
})()
}
}
//创建InfoWindow
function createInfoWindow(i){
var json = markerArr[i];
var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
return iw;
}
//创建一个Icon
function createIcon(json){
var icon = new BMap.Icon("images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
return icon;
}
var map = new BMap.Map("container",{mapType: BMAP_NORMAL_MAP}); //设置卫星图为底图
var point = new BMap.Point(121.46950,31.22643); // 创建点坐标
map.centerAndZoom(point,14); // 初始化地图,设置中心点坐标和地图级别。
//map.addControl(new BMap.MapTypeControl());
map.addControl(new BMap.NavigationControl());
map.enableScrollWheelZoom(); // 启用滚轮放大缩小。
map.enableKeyboard(); // 启用键盘操作。
map.setCurrentCity("上海"); // 设置地图显示的城市 此项是必须设置的
//标注点数组
var markerArr = [{title:"目前位置",content:"我的备注",point:"121.46950"+"|"+"31.22643",isOpen:0,icon:{w:21,h:21,l:0,t:0,x:6,lb:5}}
];
//alert(document.cookie.split(";")[1].split("-")[0]+"|"+document.cookie.split(";")[1].split("-")[1].split("=")[0]);
//创建marker
function addMarker(){
for(var i=0;i<markerArr.length;i++){
var json = markerArr[i];
var p0 = json.point.split("|")[0];
var p1 = json.point.split("|")[1];
var point = new BMap.Point(p0,p1);
var iconImg = createIcon(json.icon);
var marker = new BMap.Marker(point,{icon:iconImg});
var iw = createInfoWindow(i);
var label = new BMap.Label(json.title,{"offset":new BMap.Size(json.icon.lb-json.icon.x+10,-20)});
alert(label);
marker.setLabel(label);
map.addOverlay(marker);
label.setStyle({
borderColor:"#808080",
color:"#333",
cursor:"pointer"
});
(function(){
alert("createInfoWindow");
var index = i;
var _iw = createInfoWindow(i);
var _marker = marker;
_marker.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
});
_iw.addEventListener("open",function(){
_marker.getLabel().hide();
})
_iw.addEventListener("close",function(){
_marker.getLabel().show();
})
label.addEventListener("click",function(){
_marker.openInfoWindow(_iw);
})
alert(!!json.isOpen);
if(!!json.isOpen){
label.hide();
_marker.openInfoWindow(_iw);
}
})()
}
}
//创建InfoWindow
function createInfoWindow(i){
var json = markerArr[i];
var iw = new BMap.InfoWindow("<b class='iw_poi_title' title='" + json.title + "'>" + json.title + "</b><div class='iw_poi_content'>"+json.content+"</div>");
return iw;
}
//创建一个Icon
function createIcon(json){
var icon = new BMap.Icon("images/us_mk_icon.png", new BMap.Size(json.w,json.h),{imageOffset: new BMap.Size(-json.l,-json.t),infoWindowOffset:new BMap.Size(json.lb+5,1),offset:new BMap.Size(json.x,json.h)})
return icon;
}
...全文
相关推荐
Qt加载百度离线地图
Qt4.8.6加载百度离线地图,实现了街道图和卫星图的切换,实现了地图中标签的移动,实现了获取地图坐标并在Qt界面显示。绝对原创,保证可用
【百度API调用】离线地图V3.0制作
参考博客: https://blog.csdn.net/wml00000/article/details/82219015 https://blog.csdn.net/qq_40594137/article/details/102678501 瓦片地图下载工具(全能地图下载器:MapTileDownloader):百度云链接:https://pan.baidu.com/s/1xhTwFKXVJT07-QkB8R2HoA 提取码:1kzc 一、描述 &nbs
Qt5加载百度离线地图实例
Qt5加载百度地图,这个是根据网上搜到的另个TestMap.rar文件修改而来,适用于Qt5版本,还修复了,编译无法通过的内容,添加了编译说明,如果有什么问题,欢迎在下方评论,随时沟通
QT调用百度离线地图
次代码精简充分,绝对能跑,实现了加载离线地图,并与地图进行交互,适合如初学者。(最简单的地图调用)
Qt实现的百度在线地图与离线地图(利用QWebEngine实现)
嵌入式Qt实现百度在线地图与离线地图,利用QWebEngine实现,其中包含Qt与js通信技术,如需使用QWebKit实现,方法逻辑类似。功能包含:离线与在线切换,街道与卫星地图切换,坐标查找,添加坐标。其它功能后续更新,适合嵌入式Qt地图开发初学者参考。另附地图下载工具:全能地图下载器(未注册,下载后的图片会带有水印,可作学习利用),谢谢支持!


