mirror of https://gitee.com/antv-l7/antv-l7
81 lines
2.1 KiB
HTML
81 lines
2.1 KiB
HTML
<!doctype html>
|
|
<html lang="en" >
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta http-equiv="X-UA-Compatible" content="chrome=1">
|
|
<script type="text/javascript">
|
|
</script>
|
|
<meta name="viewport" content="initial-scale=1.0, user-scalable=no, width=device-width">
|
|
<style type="text/css">
|
|
html,body,.map{
|
|
width: 100%;
|
|
height: 100%;
|
|
margin: 0px;
|
|
}
|
|
</style>
|
|
<title>简易行政区图-世界</title>
|
|
</head>
|
|
<body>
|
|
<div id="container" class="map" tabindex="0"></div>
|
|
<script language="javascript" src="https://webapi.amap.com/maps?v=1.4.15&key=15cd8a57710d40c9b7c0e3cc120f1200&plugin=Map3D,AMap.DistrictLayer,AMap.Scale,AMap.ToolBar"></script>
|
|
<script type="text/javascript">
|
|
|
|
var SOC = 'CHN'
|
|
var colors = {};
|
|
var getColorBySOC = function(SOC){
|
|
//可按需改为其他实现
|
|
if(SOC){
|
|
if(!colors[SOC]){
|
|
var R = SOC.charCodeAt(0)*2
|
|
var G = R;//SOC.charCodeAt(1)*2
|
|
var B = 255;
|
|
colors[SOC] = 'rgb('+R+','+G+','+B +')';
|
|
}
|
|
return colors[SOC]
|
|
}else{
|
|
return 'rgb(200,200,240)'
|
|
|
|
}
|
|
|
|
}
|
|
|
|
var disWorld = new AMap.DistrictLayer.World({
|
|
zIndex:10,
|
|
styles:{
|
|
// 颜色格式: #RRGGBB、rgba()、rgb()、[r,g,b,a]
|
|
'nation-stroke':function(props){
|
|
//props:{type:Nation_Border_China/Nation_Border_Foreign}
|
|
if(props.type=='Nation_Border_China'){
|
|
return 'red'
|
|
}else{
|
|
return 'white'
|
|
}
|
|
},
|
|
'coastline-stroke': [0.8, 0.63, 1, 1],
|
|
'fill':function(props){
|
|
//props:{NAME_CHH,NAME_ENG,SOC}
|
|
return getColorBySOC(props.SOC)
|
|
}
|
|
}
|
|
})
|
|
var map = new AMap.Map("container",{
|
|
zooms: [3, 15],
|
|
center:[100,36],
|
|
showIndoorMap:false,
|
|
zoom: 3,
|
|
isHotspot:false,
|
|
defaultCursor:'pointer',
|
|
touchZoomCenter:1,
|
|
pitch: 0,
|
|
layers:[
|
|
disWorld
|
|
],
|
|
viewMode:'3D',
|
|
resizeEnable: true
|
|
})
|
|
map.addControl(new AMap.Scale());
|
|
map.addControl(new AMap.ToolBar({liteStyle:true}));
|
|
</script>
|
|
</body>
|
|
|
|
</html> |