<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Documenttitle>
<style>
body {
margin: 0;
overflow: hidden;
background: #fff;
width: 100%;
height: 100%;
position: absolute;
top: 0;
}
#map {
margin: 0 auto;
width: 100%;
height: 100%;
}
#btn_box {
position: absolute;
left: 100px;
top: 10px;
text-align: center;
z-index: 999999
}
style>
head>
<body>
<div id="map">
div>
body>
<script type="text/javascript" src="https://iclient.supermap.io/web/libs/iclient8c/libs/SuperMap.Include.js">script>
<script type="text/javascript" src="https://mapv.baidu.com/build/mapv.js">script>
<script type="text/javascript" src="https://iclient.supermap.io/dist/classic/iclient-classic.js">script>
<script type="text/javascript">
var host = window.isLocal ? window.server : "https://iserver.supermap.io"
var map,
baseLayer,
mapvLayer,
url = host + "/iserver/services/map-china400/rest/maps/China_4326"
init()
function init() {
if (!document.createElement('canvas').getContext) {
widgets.alert.showAlert(resources.msg_supportCanvas, false);
return;
}
map = new SuperMap.Map("map", {
controls: [
new SuperMap.Control.Attribution(),
new SuperMap.Control.ScaleLine(),
new SuperMap.Control.Zoom(),
new SuperMap.Control.Navigation({
dragPanOptions: {
enableKinetic: true
}
})
]
})
baseLayer = new SuperMap.Layer.TiledDynamicRESTLayer(
"China",
url,
{
transparent: true,
cacheEnabled: true
},
{
maxResolution: 'auto'
}
)
baseLayer.events.on({
layerInitialized: addLayer
})
}
function addLayer() {
map.addLayers([baseLayer])
map.setCenter(new SuperMap.LonLat(116.4, 39.9), 2)
createMapVLayer()
}
function createMapVLayer() {
var randomCOunt = 1000
var data = []
var citys = [
'北京',
'天津',
'上海',
'重庆',
'石家庄',
'太原',
'呼和浩特',
'哈尔滨',
'长春',
'沈阳',
'济南',
'南京',
'合肥',
'杭州',
'南昌',
'福州',
'郑州',
'武汉',
'长沙',
'广州',
'南宁',
'西安',
'银川',
'兰州',
'西宁',
'乌鲁木齐',
'成都',
'贵阳',
'昆明',
'拉萨',
'海口'
]
while (randomCOunt--) {
var cityCenter = mapv.utilCityCenter.getCenterByCityName(
citys[parseInt(Math.random() * citys.length)]
);
data.push({
geometry: {
type: "Point",
coordinates: [
cityCenter.lng - 2 + Math.random() * 4,
cityCenter.lat - 2 + Math.random() * 4
]
},
count: 30 * Math.random()
})
}
var dataSet = new mapv.DataSet(data)
var options = {
fillStyle: 'rgba(55, 50, 250, 0.8)',
shadowColor: 'rgba(250, 250, 250, 1)',
shadowBlur: 20,
max: 100,
size: 50,
unit: 'px',
label: {
show: true,
fillStyle: 'white'
},
globalAlpha: 0.5,
gradient: {
0.25: 'rgb(0,0,255)',
0.55: 'rgb(0,255,0)',
0.85: 'yellow',
1.0: 'rgb(255,0,0)'
},
draw: 'honeycomb'
}
mapvLayer = new SuperMap.Layer.MapVLayer('mapv', {
dataSet: dataSet,
options: options
});
map.addLayer(mapvLayer);
}
script>
html>
