Bản đồ trình bày màu theo đối tượng. Ví dụ: tại đây
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="http://vietnam.diagioi.gov.vn:8080/jquery/jquery/jquery.min.js"></script>
<script type="text/javascript" src="http://vietnam.diagioi.gov.vn:8081/api/api.js"></script>
<link rel="stylesheet" href="http://vietnam.diagioi.gov.vn:8081/api/style.css">
<script type="text/javascript">
var config = {
token: "your api key",
scope: '51',
drilldown: true,
name: 'Quảng Ngãi',
featureClass: 'kgtinh_diaphan',
kghuyen_diaphan: {
"522": {
name: "Thành phố Quảng Ngãi",
yearFounded: "2000",
style: {
fillColor: 'red', //màu tô
strokeColor: '', //màu viền
fillOpacity: 0.3, //độ trong suốt
strokeWidth: 1 //độ rộng viền
}
},
"524": {
name: "Huyện Bình Sơ",
yearFounded: "2000",
style: {
fillColor: 'red',
strokeColor: '',
fillOpacity: 0.7,
strokeWidth: 1
}
},
"525": {
name: "Huyện Trà Bồng",
yearFounded: "2000",
style: {
fillColor: '#690F13',
strokeColor: '',
fillOpacity: 0.8,
strokeWidth: 1
}
},
"526": {
name: "Huyện Tây Trà",
yearFounded: "2000",
style: {
fillColor: '#690F13',
strokeColor: '',
fillOpacity: 0.8,
strokeWidth: 1
}
},
"528": {
name: "Huyện Tư Nghĩa",
yearFounded: "2000",
style: {
fillColor: '#690F13',
strokeColor: '',
fillOpacity: 0.8,
strokeWidth: 1
}
},
"529": {
name: "Huyện Sơn Hà",
yearFounded: "2000",
style: {
fillColor: '#690F13',
strokeColor: '',
fillOpacity: 0.8,
strokeWidth: 1
}
},
"530": {
name: "Huyện Sơn Tây",
yearFounded: "2000",
style: {
fillColor: '#690F13',
strokeColor: '',
fillOpacity: 0.8,
strokeWidth: 1
}
}
}
}
var map = new AdminMap('map', config);
</script>
</head>
<body>
<div>
<h3>Ví dụ: Bản đồ tô màu</h3>
</div>
<div id="map" style="width:1024px; height:500px;margin-top:10px !important;position:relative;">
</div>
<ul class="breadcrumb">
<li>
<a href="#" onclick="viewCountry()">Toàn quốc</a>
</li>
<li id="province" style="display:none">
<a href="#" onclick="viewProvince()">
<span id="provincec">Tỉnh</span>
</a>
</li>
<li id="distric" style="display:none">
<a href="#">
<span id="districc" ;>Huyện</span>
</a>
</li>
</ul>
</body>
</html>