<!DOCTYPE html>
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
<head>
|
<meta charset="utf-8">
|
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
|
<meta name="renderer" content="webkit">
|
<title th:text="${sysName}">智慧粮库管理系统</title>
|
|
<!-- <script src="//api.map.baidu.com/api?v=1.0&type=webgl&ak=6iuHQC5hj593uHqVgSlDaPPpxBaGhVBk"></script> -->
|
<!-- <script src="//mapv.baidu.com/build/mapv.min.js"></script> -->
|
<!-- <script src="https://code.bdstatic.com/npm/mapvgl@1.0.0-beta.146/dist/mapvgl.min.js"></script> -->
|
<!-- <link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css" /> -->
|
|
<script th:src="@{/group/map.js}"></script>
|
<link rel="stylesheet" type="text/css" th:href="@{/group/pc-reset.css}" />
|
<link rel="stylesheet" type="text/css" th:href="@{/group/master.css}" />
|
<link rel="stylesheet" type="text/css" th:href="@{/group/newstyle.css}" />
|
|
<style>
|
.anchorBL,
|
.BMap_cpyCtrl.anchorBL {
|
display: none !important;
|
;
|
}
|
|
.BMap_bubble_pop {
|
background: url(../../group/img/sup-popBg2.png) no-repeat;
|
background-size: 100% 100%;
|
padding: 20px 20px 30px 20px !important;
|
background-color: transparent !important;
|
border: 0 !important;
|
box-sizing: border-box;
|
overflow: hidden;
|
}
|
|
/*地图标题*/
|
.BMap_bubble_top {
|
display: none !important;
|
;
|
}
|
|
/* 消息内容 */
|
.BMap_bubble_center {
|
background: transparent !important;
|
box-sizing: border-box;
|
overflow: hidden;
|
|
}
|
|
/* 左上角删除按键 */
|
.BMap_bubble_pop>img {
|
display: none !important;
|
top: -99999px !important;
|
;
|
}
|
</style>
|
</head>
|
|
<body>
|
|
<div class="container">
|
<div class="i-top">
|
<h1 class="i-top-tit"><span>攻策性储备粮油监管平台</span></h1>
|
<p class="i-top-p" style="color: #f34141;">不忘初心，牢记使命，为中国人民谋幸福，为中华民族谋复兴</p>
|
<div class="i-navBar">
|
<a href="#" class="i-nav1">首页</a>
|
<a href="#" class="i-nav2">数量总览</a>
|
<a href="#" class="i-nav3 on">GIS监管</a>
|
<a href="#" class="i-nav4">轮换执行</a>
|
<a href="#" class="i-nav5">预警分析</a>
|
<a href="#" class="i-nav6">后台管理</a>
|
<a href="#" class="i-nav7">退出系统</a>
|
</div>
|
<div class="date-time-module">
|
<span id="navBarTime"></span>
|
<div class="i-top-date">
|
<span id="navBarDate"></span>
|
<span id="navBarWeek"></span>
|
</div>
|
</div>
|
<!-- <div id="data"></div> -->
|
|
</div><!--i-top end-->
|
|
<div class="c-main cl">
|
<div class="c-left">
|
<div class="o-btn">
|
<img src="../../group/img/c-btn1.png" alt="">
|
</div>
|
<div class="inner">
|
<div class="close"></div>
|
<div class="m-box1">
|
<div class="l">
|
<div class="chartbox">
|
<div class="chart" id="breedChart"></div>
|
<div class="txt">
|
<div class="n">201</div>
|
<div class="p">其它油</div>
|
</div>
|
</div>
|
</div>
|
<div class="r">
|
<ul class="ul-listb1">
|
<li>
|
<div class="con" style="background-color: rgba(0, 228, 250,.05);">
|
<div class="dot" style="background-color: rgb(0, 228, 250);"></div>
|
<div class="num" style="color: rgb(0, 228, 250);">42.2%</div>
|
<div class="type">混合小麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(22, 226, 173,.05);">
|
<div class="dot" style="background-color: rgb(22, 226, 173);"></div>
|
<div class="num" style="color: rgb(22, 226, 173);">12.6%</div>
|
<div class="type">小麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(255, 181, 23,.05);">
|
<div class="dot" style="background-color: rgb(255, 181, 23);"></div>
|
<div class="num" style="color: rgb(255, 181, 23);">21.0%</div>
|
<div class="type">玉米</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(238, 60, 72,.05);">
|
<div class="dot" style="background-color: rgb(238, 60, 72);"></div>
|
<div class="num" style="color: rgb(238, 60, 72);">5.8%</div>
|
<div class="type">稻谷</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(135, 103, 255,.05);">
|
<div class="dot" style="background-color: rgb(135, 103, 255);"></div>
|
<div class="num" style="color: rgb(135, 103, 255);">0.9%</div>
|
<div class="type">青稞</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(41, 122, 255,.05);">
|
<div class="dot" style="background-color: rgb(41, 122, 255);"></div>
|
<div class="num" style="color: rgb(41, 122, 255);">10.2%</div>
|
<div class="type">苦荞麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(238, 60, 144,.05);">
|
<div class="dot" style="background-color: rgb(238, 60, 144);"></div>
|
<div class="num" style="color: rgb(238, 60, 144);">16.2%</div>
|
<div class="type">大豆</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(0, 228, 250,.05);">
|
<div class="dot" style="background-color: rgb(0, 228, 250);"></div>
|
<div class="num" style="color: rgb(0, 228, 250);">42.2%</div>
|
<div class="type">混合小麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(22, 226, 173,.05);">
|
<div class="dot" style="background-color: rgb(22, 226, 173);"></div>
|
<div class="num" style="color: rgb(22, 226, 173);">12.6%</div>
|
<div class="type">小麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(255, 181, 23,.05);">
|
<div class="dot" style="background-color: rgb(255, 181, 23);"></div>
|
<div class="num" style="color: rgb(255, 181, 23);">21.0%</div>
|
<div class="type">玉米</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(238, 60, 72,.05);">
|
<div class="dot" style="background-color: rgb(238, 60, 72);"></div>
|
<div class="num" style="color: rgb(238, 60, 72);">5.8%</div>
|
<div class="type">稻谷</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(135, 103, 255,.05);">
|
<div class="dot" style="background-color: rgb(135, 103, 255);"></div>
|
<div class="num" style="color: rgb(135, 103, 255);">0.9%</div>
|
<div class="type">青稞</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(41, 122, 255,.05);">
|
<div class="dot" style="background-color: rgb(41, 122, 255);"></div>
|
<div class="num" style="color: rgb(41, 122, 255);">10.2%</div>
|
<div class="type">苦荞麦</div>
|
</div>
|
</li>
|
<li>
|
<div class="con" style="background-color: rgba(238, 60, 144,.05);">
|
<div class="dot" style="background-color: rgb(238, 60, 144);"></div>
|
<div class="num" style="color: rgb(238, 60, 144);">16.2%</div>
|
<div class="type">大豆</div>
|
</div>
|
</li>
|
</ul>
|
</div>
|
</div>
|
<div class="m-box2">
|
<div class="item">
|
|
<div class="bot">
|
<div class="chart" id="ss"></div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="c-cen">
|
<img src="../../group/img/c-map.png" alt="">
|
</div>
|
<div class="c-right">
|
<div class="o-btn">
|
<img src="../../group/img/c-btn2.png" alt="">
|
</div>
|
<div class="inner">
|
<div class="close"></div>
|
<div class="m-nav">
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><b class="t">陕西省</b></a>
|
</div>
|
<div class="sub two">
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市</span></a>
|
</div>
|
<div class="sub three">
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司
|
凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有
|
公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市高陵区奉义粮
|
储备有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市群众面粉厂</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安爱菊油脂有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安西粮实业有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市鄂邑区宏诚火车站
|
粮库有限公司</span></a>
|
</div>
|
</div>
|
</div>
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市</span></a>
|
</div>
|
<div class="sub three">
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司
|
凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有
|
公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市高陵区奉义粮
|
储备有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市群众面粉厂</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安爱菊油脂有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安西粮实业有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市鄂邑区宏诚火车站
|
粮库有限公司</span></a>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><b class="t">陕西省</b></a>
|
</div>
|
<div class="sub two">
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市</span></a>
|
</div>
|
<div class="sub three">
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司
|
凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有
|
公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市高陵区奉义粮
|
储备有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市群众面粉厂</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安爱菊油脂有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安西粮实业有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市鄂邑区宏诚火车站
|
粮库有限公司</span></a>
|
</div>
|
</div>
|
</div>
|
<div class="con">
|
<div class="tit">
|
<div class="arr"></div>
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市</span></a>
|
</div>
|
<div class="sub three">
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有公司
|
凤城七路成品库</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">陕西军粮供应集团有
|
公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市高陵区奉义粮
|
储备有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市群众面粉厂</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安爱菊油脂有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安西粮实业有限公司</span></a>
|
</div>
|
<div class="tit">
|
<a href="javascript:;" class="v1"><i class="icon"></i><span class="t">西安市鄂邑区宏诚火车站
|
粮库有限公司</span></a>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
|
|
|
</div>
|
</div>
|
</div>
|
|
</div><!--i-main end-->
|
|
</div>
|
|
|
<script th:src="@{/js/jquery.min.js}"></script>
|
<script th:src="@{/ajax/libs/echarts/echarts.min.js}"></script>
|
<script th:src="@{/group/newindex.js}"></script>
|
<script th:src="@{/group/common.js}"></script>
|
|
var map = new BMapGL.Map('map_container', {
|
enableDblclickZoom: false,
|
displayOptions: {
|
building: false
|
}
|
});
|
// map.centerAndZoom(new BMapGL.Point(103.838383, 30.048353),8);
|
map.centerAndZoom(new BMapGL.Point(104, 29.5),9);
|
|
map.enableScrollWheelZoom(true);
|
|
|
|
var bd = new BMapGL.Boundary();
|
|
map.setTilt(0);
|
map.setDisplayOptions({
|
poiText: false, // 隐藏poi标注
|
poiIcon: false, // 隐藏poi图标
|
building: false // 隐藏楼块
|
});
|
|
var map = initMap({
|
|
center: [103.8, 29.5],
|
zoom: 9,
|
style: purpleStyle
|
});
|
|
|
|
//掩膜 图需要http
|
// var wms = new BMapGL.XYZLayer({
|
// useThumbData: true,
|
// tileUrlTemplate: 'https://ows.mundialis.de/services/service?&service=WMS&' +
|
// 'request=GetMap&layers=TOPO-WMS%2COSM-Overlay-WMS&styles=&format=image%2Fjpeg&' +
|
// 'transparent=false&version=1.1.1&width=256&height=256&srs=EPSG%3A3857&bbox=[b]',
|
// // tileUrlTemplate: '../../images/visual/i-body.png',
|
// });
|
// map.addTileLayer(wms);
|
|
|
|
var pStart = new BMapGL.Point(101, 28);
|
var pEnd = new BMapGL.Point(106, 31.5);
|
var bounds = new BMapGL.Bounds(new BMapGL.Point(pStart.lng, pEnd.lat), new BMapGL.Point(pEnd.lng, pStart.lat));
|
var imgOverlay = new BMapGL.GroundOverlay(bounds, {
|
type: 'image',
|
url: '../../images/visual/img-map.png',
|
opacity: 1
|
});
|
map.addOverlay(imgOverlay);
|
|
// 创建点标记
|
var point = new BMapGL.Point(103.7, 30.5);
|
var myIcon = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker = new BMapGL.Marker(point, {
|
icon: myIcon
|
});
|
map.addOverlay(marker);
|
|
|
|
|
// 创建文本标注坐标
|
var opts1 = {
|
position: point, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label = new BMapGL.Label('东坡区', opts1);
|
// 自定义文本标注样式
|
label.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
map.addOverlay(label);
|
|
|
|
|
var content = '<div style="height:100%;box-sizing:border-box;"><h3 style="margin:0 0 10px 0;line-height:24px;font-size:18px;color:#fff;">眉山市国有粮油储备有限公司</h3><p style="line-height:24px;font-size:18px;color:#fff;"><img src="../../images/visual/icon-address.png" alt="" style="float:left;width:24px;height:24px;margin-right:3px;"/>眉山市东坡区XX路20号</P><div class="right-topInfo-kd sup-topInfo-kd"><div class="right-topInfo-kd-item"><h3>粮仓个数(个)</h3><p>20</p></div><div class="right-topInfo-kd-item"><h3>油罐个数(个)</h3><p>10</p></div></div><ul class="right-topInfo-kd-list right-topInfo-jg sup-topInfo-list"><li><p>90000</p><h3>粮食储量(吨)</h3></li><li><p>10000</p><h3>植物油储量(吨)</h3></li><li><p>4500</p><h3>占地面积（㎡）</h3></li></ul><a href="" class="sup-deatil-link"><img src="../../images/visual/spu-detail-btn.png" alt="" style="width:100%;height:100%;"/></a></div>';
|
|
|
|
|
// 创建信息窗口
|
var opts = {
|
width: 376,
|
height: 324,
|
enableAutoPan : true, //自动平移
|
message: ""
|
};
|
var infoWindow = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow, point); // 开启信息窗口
|
});
|
|
// varopenInfoWinFun=function(){
|
// marker.openInfoWindow(infoWindow);
|
// };
|
// marker.addEventListener("click", openInfoWinFun);
|
// return openInfoWinFun
|
|
|
// 创建点标记
|
var point2 = new BMapGL.Point(102.75,30.3);
|
var myIcon2 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker2 = new BMapGL.Marker(point2, {
|
icon: myIcon2
|
});
|
map.addOverlay(marker2);
|
|
var infoWindow2 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker2.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow2, point2); // 开启信息窗口
|
});
|
|
|
// 创建文本标注坐标
|
var opts2 = {
|
position: point2, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label2 = new BMapGL.Label('丹棱县', opts2);
|
// 自定义文本标注样式
|
label2.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label2);
|
|
|
|
|
// 创建点标记
|
var point3 = new BMapGL.Point(102.2,29.3);
|
var myIcon3 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker3 = new BMapGL.Marker(point3, {
|
icon: myIcon3
|
});
|
map.addOverlay(marker3);
|
|
var infoWindow3 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker3.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow3, point3); // 开启信息窗口
|
});
|
|
|
// 创建文本标注坐标
|
var opts3 = {
|
position: point3, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label3 = new BMapGL.Label('丹棱县', opts3);
|
// 自定义文本标注样式
|
label3.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label3);
|
|
|
|
|
|
|
|
|
// 创建点标记
|
var point4 = new BMapGL.Point(103.95,29.6);
|
var myIcon4 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker4 = new BMapGL.Marker(point4, {
|
icon: myIcon4
|
});
|
map.addOverlay(marker4);
|
|
var infoWindow4 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker4.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow4, point4); // 开启信息窗口
|
});
|
|
// 创建文本标注坐标
|
var opts4 = {
|
position: point4, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label4 = new BMapGL.Label('青神县', opts4);
|
// 自定义文本标注样式
|
label4.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label4);
|
|
|
|
|
// 创建点标记
|
var point5 = new BMapGL.Point(105.1,30.1);
|
var myIcon5 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker5 = new BMapGL.Marker(point5, {
|
icon: myIcon5
|
});
|
map.addOverlay(marker5);
|
|
var infoWindow5 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker5.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow5, point5); // 开启信息窗口
|
});
|
|
|
// 创建文本标注坐标
|
var opts5 = {
|
position: point5, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label5 = new BMapGL.Label('仁寿县', opts5);
|
// 自定义文本标注样式
|
label5.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label5);
|
|
|
|
|
// 创建点标记
|
var point6 = new BMapGL.Point(104.65,30.85);
|
var myIcon6 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker6 = new BMapGL.Marker(point6, {
|
icon: myIcon6
|
});
|
map.addOverlay(marker6);
|
|
var infoWindow6 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker6.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow6, point6); // 开启信息窗口
|
});
|
|
|
// 创建文本标注坐标
|
var opts6 = {
|
position: point6, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-35, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label6 = new BMapGL.Label('天府新区', opts6);
|
// 自定义文本标注样式
|
label6.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label6);
|
|
|
|
|
|
// 创建点标记
|
var point7 = new BMapGL.Point(104.05,31.15);
|
var myIcon7 = new BMapGL.Icon("../../images/visual/icon-dian.png", new BMapGL.Size(50, 50));
|
var marker7 = new BMapGL.Marker(point7, {
|
icon: myIcon7
|
});
|
map.addOverlay(marker7);
|
|
var infoWindow7 = new BMapGL.InfoWindow(content, opts);
|
// 点标记添加点击事件
|
marker7.addEventListener('click', function () {
|
map.openInfoWindow(infoWindow7, point7); // 开启信息窗口
|
});
|
|
// 创建文本标注坐标
|
var opts7 = {
|
position: point7, // 指定文本标注所在的地理位置
|
offset: new BMapGL.Size(-25, 25) // 设置文本偏移量
|
};
|
// 创建文本标注对象
|
var label7 = new BMapGL.Label('彭山区', opts7);
|
// 自定义文本标注样式
|
label7.setStyle({
|
color: '#fff',
|
border:'0',
|
backgroundColor:'none',
|
fontSize: '18px',
|
height: '20px',
|
lineHeight: '20px',
|
fontFamily: '微软雅黑'
|
});
|
|
map.addOverlay(label7);
|
|
|
|
|
function openInfoWindow1() {
|
map.panTo(point);
|
map.openInfoWindow(infoWindow, point);
|
}
|
|
function openInfoWindow2() {
|
map.panTo(point7);
|
map.openInfoWindow(infoWindow, point7);
|
}
|
</script> -->
|
</body>
|
|
</html>
|
