123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149 |
- <!--********************************************************************
- * Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
- *********************************************************************-->
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title data-i18n="resources.title_darkblueStyle"></title>
- <script type="text/javascript" include="bootstrap,widgets.alert" src="../js/include-web.js"></script>
- <script type="text/javascript" exclude="iclient-classic" src="../../dist/classic/include-classic.js"></script>
- <style type="text/css">
- body {
- margin: 0;
- overflow: hidden;
- background: #fff;
- width: 100%;
- height: 100%
- }
- #map {
- position: absolute;
- width: 100%;
- height: 100%;
- }
- </style>
- </head>
- <body>
- <div id="map"></div>
- <script type="text" id="cartoCssStr">
- /*此处定义不同的颜色变量,在后面可以重复用这些颜色值*/
- @waterColor:rgb(2,16,25);
- @roadColora:rgb(18,117,142);
- @roadColorb:rgb(0,0,0);
- @railwayColora:rgb(0,0,0);
- @railwayColorb:rgb(0,0,0);
- @vegetationColor:rgb(2,16,25);
- @continentColor:rgb(8,48,75);
- @provinceLineColor:rgb(30,30,30);
- /*中国除外的其他国家的图层*/
- #World_Continent_pl___China{
- polygon-fill:@continentColor;
- line-width:1;
- line-color:@continentColor;
- }
- #China_Province_pl___China{
- polygon-fill:@continentColor;
- line-color:rgba(0,0,0,0);
- }
- #Arterial_Road_ln___China::one{
- line-color:@roadColora;
- line-width:2;}
- #Arterial_Road_ln___China::two{
- line-color:@roadColorb;
- line-width:1;}
- #Arterial_Road_ln___China___1::one{
- line-color:@roadColora;
- line-width:2;}
- #Arterial_Road_ln___China___1::two{
- line-color:@roadColorb;
- line-width:1;}
- #Arterial_Road_ln___China___1___1::one{
- line-color:@roadColora;
- line-width:2;}
- #Arterial_Road_ln___China___1___1::two{
- line-color:@roadColorb;
- line-width:1;}
- #Main_Road_L___China::one{
- line-color:@roadColora;
- line-width:2;}
- #Main_Road_L___China::two{
- line-color:@roadColorb;
- line-width:1;}
- #Main_Road_L___China___1::one{
- line-color:@roadColora;
- line-width:2;}
- #Main_Road_L___China___1::two{
- line-color:@roadColorb;
- line-width:1;}
- #Main_Road_L___China___1___1::a{
- line-color:@roadColora;
- line-width:2;}
- #Main_Road_L___China___1___1::b{
- line-color:@roadColorb;
- line-width:1;}
- #Hydside_Area_pl___Hydside{
- polygon-fill:@waterColor;
- line-color:@waterColor;
- }
- #China_Provinces_L___China400{
- line-dasharray:10,10;
- line-color:@provinceLineColor;
- line-width:1;
- }
- </script>
- <script>
- var map, layer, cartoCss,
- host = window.isLocal ? window.server : "https://iserver.supermap.io",
- url = host + "/iserver/services/map-china400/rest/maps/China";
- 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.ScaleLine(),
- new SuperMap.Control.Zoom(),
- new SuperMap.Control.MousePosition(),
- new SuperMap.Control.Navigation({
- dragPanOptions: {
- enableKinetic: true
- }
- })]
- });
- cartoCss = document.getElementById("cartoCssStr").text;
- layer = new SuperMap.Layer.TiledVectorLayer("China", url, {cacheEnabled: true}, {
- useLocalStorage: true,
- cartoCss: cartoCss,
- donotNeedServerCartoCss: true
- });
- layer.events.on({"layerInitialized": addLayer});
- }
- function addLayer() {
- map.addLayers([layer]);
- var center = new SuperMap.LonLat(12957388, 4853991);
- map.setCenter(center, 11);
- }
- </script>
- </body>
- </html>
|