##GIS地图的相关技术!!!做GIS地图的问题的值得一看,如随机生成点,定义标签等!!!
1.首先肯定是要根据自己需要先把地图给放上面来,拿肯定要百度地图或者Google Chrome的地图也可以的。具体可以看看API,看我
` //需要引包
// 百度地图
var map = new BMap.Map(“allmap”); // 创建Map实例
var point = new BMap.Point(113.309828, 23.136677); // 创建点坐标
map.centerAndZoom(new BMap.Point(113.309828, 23.136677), 13); // 初始化地图,设置中心点坐标和地图级别
//添加地图类型控件
map.addControl(new BMap.MapTypeControl({
mapTypes:[
BMAP_NORMAL_MAP,
BMAP_HYBRID_MAP
]}));
map.setCurrentCity("广州市"); // 设置地图显示的城市 此项是必须设置的
map.enableScrollWheelZoom(true); //开启鼠标滚轮缩放
var marker = new BMap.Marker(point); // 创建标注
map.addOverlay(marker); // 将标注添加到地图中
map.centerAndZoom(point,15);
marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画`
2。给地图上如何随机生成自己带图片的标签。
var point1 = new BMap.Point(113.251107, 23.42196); // 创建点坐标
var myIcon = new BMap.Icon("/static/image/analysis/spjk2/ruqin.png", new BMap.Size(50,50));//自定义大小,插入图等。
var marker2 = new BMap.Marker(point1,{icon:myIcon});
markerRuqinArr.push(marker2);
map.addOverlay(marker2); // 将标注添加到地图中
marker2.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
marker2.addEventListener("click", function(){//自己定义事件就可以了。
layer.open({
type: 1,
title: "",
area: ['350px', '350px'],
shade: 0,
closeBtn: 1,
shadeClose: false,
content:'',
success:function(){
$(".layui-layer-content").css("overflow","hidden")
}
});
$(".checkbox_false_disable").hide(500);
// 更换字体
initTimeline5()
setInterval(function () {
$(".checkbox_false_disable").show();
},500)
});
3.如何在页面上随机生成多个自定义标签。
![大概就是个这样的如果要生成多个不同标记就多写几个方法,或者写个for循环把他们遍历了
](https://img-blog.csdnimg.cn/20191105102357638.png?x-oss-process=image/waterm
var bounds = map.getBounds();
var sw = bounds.getSouthWest();
var ne = bounds.getNorthEast();
var lngSpan = Math.abs(sw.lng - ne.lng);
var latSpan = Math.abs(ne.lat - sw.lat);
for (var i = 0; i < 3; i ++) {
var point1 = new BMap.Point(113.515107, 23.32196); // 创建点坐标
var point1 = new BMap.Point(sw.lng + lngSpan * (Math.random() * 0.87), ne.lat - latSpan * (Math.random() * 0.87));//这是用来分布大小的。
var myIcon = new BMap.Icon("/static/image/analysis/spjk2/jgycyy.png", new BMap.Size(50,50));
var marker2 = new BMap.Marker(point1,{icon:myIcon});
markerJgycyyArr.push(marker2);
map.addOverlay(marker2); // 将标注添加到地图中
marker2.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
marker2.addEventListener("click", function(){
layer.open({
type: 1,
title: "",
area: ['350px', '350px'],
shade: 0,
closeBtn: 1,
shadeClose: false,
content:'';success:function(){
$(".layui-layer-content").css("overflow","hidden")
}
});
});