 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							 
							| @@ -0,0 +1,59 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.min.js'></script> | |||
| <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| .viewer-container{ | |||
| position: relative; | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container" class="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP) | |||
| viewer.addBaseLayer(baseLayer, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baseLayer_img = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||
| style: 'img' | |||
| }) | |||
| viewer.addBaseLayer(baseLayer_img, { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地图' | |||
| }) | |||
| let baseLayer_cva = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||
| style: 'cva' | |||
| }) | |||
| viewer.addBaseLayer([baseLayer_img, baseLayer_cva], { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地图' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready({ | |||
| baseUrl:'../libs/dc-sdk/resources/' | |||
| }).then(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,71 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.min.js'></script> | |||
| <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| .viewer-container{ | |||
| position: relative; | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container" class="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baseLayer = DC.ImageryLayerFactory.createAmapImageryLayer( | |||
| { | |||
| crs:'WGS84' | |||
| } | |||
| ) | |||
| viewer.addBaseLayer(baseLayer, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baseLayer_img = DC.ImageryLayerFactory.createAmapImageryLayer({ | |||
| style: 'img', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baseLayer_img, { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地图' | |||
| }) | |||
| let baseLayer_cva = DC.ImageryLayerFactory.createAmapImageryLayer({ | |||
| style: 'cva', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer([baseLayer_img, baseLayer_cva], { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地图' | |||
| }) | |||
| let layer = new DC.TilesetLayer('layer') | |||
| viewer.addLayer(layer) | |||
| let tileset = new DC.Tileset( | |||
| '//resource.dvgis.cn/data/3dtiles/dayanta/tileset.json' | |||
| ) | |||
| tileset.setHeight(-420) | |||
| layer.addOverlay(tileset) | |||
| viewer.flyTo(tileset) | |||
| } | |||
| DC.ready({ | |||
| baseUrl:'../libs/dc-sdk/resources/' | |||
| }).then(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,75 @@ | |||
| <!DOCTYPE html> | |||
| <html> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createArcGisImageryLayer({ | |||
| url: | |||
| 'https://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer' | |||
| }) | |||
| viewer.addBaseLayer(baselayer, { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '影像' | |||
| }) | |||
| let baselayer_shaded = DC.ImageryLayerFactory.createArcGisImageryLayer({ | |||
| url: | |||
| 'https://services.arcgisonline.com/arcgis/rest/services/World_Shaded_Relief/MapServer' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_shaded, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baselayer_street = DC.ImageryLayerFactory.createArcGisImageryLayer({ | |||
| url: | |||
| 'https://services.arcgisonline.com/arcgis/rest/services/World_Physical_Map/MapServer' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_street, { | |||
| iconUrl: '../assets/icon/ter.png', | |||
| name: '地形' | |||
| }) | |||
| let baselayer_ter = DC.ImageryLayerFactory.createArcGisImageryLayer({ | |||
| url: | |||
| 'https://services.arcgisonline.com/arcgis/rest/services/World_Terrain_Base/MapServer' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_ter, { | |||
| iconUrl: '../assets/icon/ter.png', | |||
| name: '地形' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,96 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer_img = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style:'img' | |||
| }) | |||
| let baselayer_vec = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style:'vec' | |||
| }) | |||
| viewer.addBaseLayer([baselayer_img,baselayer_vec], { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '影像' | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createBaiduImageryLayer() | |||
| let baselayer_traffic = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style:'traffic' | |||
| }) | |||
| viewer.addBaseLayer([baselayer,baselayer_traffic], { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baselayer_dark = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'dark' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_dark, { | |||
| iconUrl: '../assets/icon/dark.png', | |||
| name: '黑夜' | |||
| }) | |||
| let baselayer_googlelite = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'googlelite' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_googlelite, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '精简' | |||
| }) | |||
| let baselayer_midnight = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'midnight' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_midnight, { | |||
| iconUrl: '../assets/icon/midnight.png', | |||
| name: '午夜蓝' | |||
| }) | |||
| let baselayer_redalert = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'redalert' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_redalert, { | |||
| iconUrl: '../assets/icon/redalert.png', | |||
| name: '红色警戒' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,106 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer_img = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style:'img', | |||
| crs:'WGS84' | |||
| }) | |||
| let baselayer_vec = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style:'vec', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer([baselayer_img,baselayer_vec], { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '影像', | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baselayer_dark = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'dark', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_dark, { | |||
| iconUrl: '../assets/icon/dark.png', | |||
| name: '黑夜' | |||
| }) | |||
| let baselayer_googlelite = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'googlelite', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_googlelite, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '精简' | |||
| }) | |||
| let baselayer_midnight = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'midnight', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_midnight, { | |||
| iconUrl: '../assets/icon/midnight.png', | |||
| name: '午夜蓝' | |||
| }) | |||
| let baselayer_redalert = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'redalert', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_redalert, { | |||
| iconUrl: '../assets/icon/redalert.png', | |||
| name: '红色警戒' | |||
| }) | |||
| let layer = new DC.TilesetLayer('layer') | |||
| viewer.addLayer(layer) | |||
| let tileset = new DC.Tileset( | |||
| '//resource.dvgis.cn/data/3dtiles/dayanta/tileset.json' | |||
| ) | |||
| tileset.setHeight(-420) | |||
| layer.addOverlay(tileset) | |||
| viewer.flyTo(tileset) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,41 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createSingleTileImageryLayer({ | |||
| url: '../assets/tile/world_b.jpg' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,41 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createSingleTileImageryLayer({ | |||
| url: '../assets/tile/world_d.jpg' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,50 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| viewer.setOptions({ | |||
| globe:{ | |||
| filterColor:DC.Color.fromCssColorString("rgb(4,54,108)") | |||
| } | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||
| viewer.addBaseLayer(baselayer, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,63 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createGoogleImageryLayer({ | |||
| style: 'img' | |||
| }) | |||
| viewer.addBaseLayer(baselayer, { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地图' | |||
| }) | |||
| let baselayer_elc = DC.ImageryLayerFactory.createGoogleImageryLayer() | |||
| viewer.addBaseLayer(baselayer_elc, { | |||
| iconUrl: '../assets/icon/elec.png', | |||
| name: '电子' | |||
| }) | |||
| let baselayer_ter = DC.ImageryLayerFactory.createGoogleImageryLayer({ | |||
| style: 'ter' | |||
| }) | |||
| viewer.addBaseLayer(baselayer_ter, { | |||
| iconUrl: '../assets/icon/img.png', | |||
| name: '地形' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,41 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createSingleTileImageryLayer({ | |||
| url: '../assets/tile/world_img.jpg' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,41 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createSingleTileImageryLayer({ | |||
| url: '../assets/tile/world_n.jpg' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,69 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <script src='https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.7.9/dat.gui.min.js'></script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createBaiduImageryLayer({ | |||
| style: 'midnight' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| addGuiController() // add controller | |||
| } | |||
| function addGuiController(){ | |||
| let controls = { | |||
| alpha :1, | |||
| brightness : 1, | |||
| contrast:1, | |||
| saturation:1 | |||
| } | |||
| let imageryLayer = viewer.imageryLayers.get(0) | |||
| let gui = new dat.GUI(); | |||
| gui.add(controls,'alpha',0,1).step(0.1).onChange(value=>{ | |||
| imageryLayer.alpha = value | |||
| }) | |||
| gui.add(controls,'brightness',-1,5).step(0.1).onChange(value=>{ | |||
| imageryLayer.brightness = value | |||
| }) | |||
| gui.add(controls,'contrast',-1,3).step(0.1).onChange(value=>{ | |||
| imageryLayer.contrast = value | |||
| }) | |||
| gui.add(controls,'saturation',0,2).step(0.1).onChange(value=>{ | |||
| imageryLayer.saturation = value | |||
| }) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,67 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function changeEnable(checked){ | |||
| viewer.mapSplit.enable = Boolean(checked) | |||
| } | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let key = '1c3ff1358b17417f1782dd1ae7bdd00a' | |||
| let img = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'img' | |||
| }) | |||
| viewer.addBaseLayer(img) | |||
| let baselayer_elc =DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key | |||
| }) | |||
| viewer.mapSplit.enable = true | |||
| viewer.mapSplit.addBaseLayer(baselayer_elc) | |||
| addGuiController() // add controller | |||
| } | |||
| function addGuiController(){ | |||
| let controls = { | |||
| enable :true, | |||
| } | |||
| let gui = new dat.GUI(); | |||
| gui.add(controls,'enable',).onChange(value=>{ | |||
| viewer.mapSplit.enable = value | |||
| }) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,79 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let key = '0f7c1d161d7352116a21aacf0e9f44c1' | |||
| let cva = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'cva' | |||
| }) | |||
| let vec = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key | |||
| }) | |||
| let img = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'img' | |||
| }) | |||
| let ter = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'ter' | |||
| }) | |||
| viewer.addBaseLayer(img, { | |||
| name: '影像', | |||
| iconUrl: '../assets/icon/img.png' | |||
| }) | |||
| viewer.addBaseLayer([img, cva], { | |||
| name: '影像', | |||
| iconUrl: '../assets/icon/img.png' | |||
| }) | |||
| viewer.addBaseLayer([vec, cva], { | |||
| name: '电子', | |||
| iconUrl: '../assets/icon/elec.png' | |||
| }) | |||
| viewer.addBaseLayer([ter, cva], { | |||
| name: '地形', | |||
| iconUrl: '../assets/icon/ter.png' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,74 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer_img = DC.ImageryLayerFactory.createTencentImageryLayer({ | |||
| style:'img' | |||
| }) | |||
| let baselayer_vec = DC.ImageryLayerFactory.createTencentImageryLayer({ | |||
| style: 2 | |||
| }) | |||
| viewer.addBaseLayer([baselayer_img,baselayer_vec], { | |||
| name: '影像', | |||
| iconUrl: '../assets/icon/img.png' | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createTencentImageryLayer() | |||
| viewer.addBaseLayer(baselayer, { | |||
| name: '经典', | |||
| iconUrl: '../assets/icon/elec.png' | |||
| }) | |||
| let baselayer_2 = DC.ImageryLayerFactory.createTencentImageryLayer({ | |||
| style: 4 | |||
| }) | |||
| viewer.addBaseLayer(baselayer_2, { | |||
| name: '墨渊', | |||
| iconUrl: '../assets/icon/dark.png' | |||
| }) | |||
| let baselayer_3 = DC.ImageryLayerFactory.createTencentImageryLayer({ | |||
| style: 8 | |||
| }) | |||
| viewer.addBaseLayer(baselayer_3, { | |||
| name: '白浅', | |||
| iconUrl: '../assets/icon/elec.png' | |||
| }) | |||
| viewer.zoomToPosition( | |||
| new DC.Position(105.565571, 31.984708, 15362816, 0, -90) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,57 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let key = '1c3ff1358b17417f1782dd1ae7bdd00a' | |||
| let baselayer = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'img' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| let terrain = DC.TerrainFactory.createArcgisTerrain({ | |||
| url: | |||
| 'https://elevation3d.arcgis.com/arcgis/rest/services/WorldElevation3D/Terrain3D/ImageServer' | |||
| }) | |||
| viewer.addTerrain(terrain) | |||
| viewer.flyToPosition( | |||
| new DC.Position( | |||
| 96.70456483909693, | |||
| 28.883444927447762, | |||
| 48977.26981733466, | |||
| 0, | |||
| -32 | |||
| ) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,54 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let key = '1c3ff1358b17417f1782dd1ae7bdd00a' | |||
| let baselayer = DC.ImageryLayerFactory.createTdtImageryLayer({ | |||
| key, | |||
| style: 'img' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| let terrain = DC.TerrainFactory.createUrlTerrain({ | |||
| url: 'http://data.marsgis.cn/terrain' | |||
| }) | |||
| viewer.addTerrain(terrain) | |||
| viewer.flyToPosition( | |||
| new DC.Position( | |||
| 96.70456483909693, | |||
| 28.883444927447762, | |||
| 48977.26981733466, | |||
| 0, | |||
| -31 | |||
| ) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| @@ -0,0 +1,58 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| viewer.setOptions({ | |||
| globe:{ | |||
| terrainExaggeration:10 | |||
| } | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer({ | |||
| style: 'img', | |||
| crs:'WGS84' | |||
| }) | |||
| viewer.addBaseLayer(baselayer) | |||
| let terrain = DC.TerrainFactory.createUrlTerrain({ | |||
| url: 'http://data.marsgis.cn/terrain' | |||
| }) | |||
| viewer.addTerrain(terrain) | |||
| viewer.flyToPosition( | |||
| new DC.Position( | |||
| 96.70456483909693, | |||
| 28.883444927447762, | |||
| 48977.26981733466, | |||
| 0, | |||
| -31 | |||
| ) | |||
| ) | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| @@ -0,0 +1,429 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.chart.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container',{ | |||
| contextOptions: { | |||
| requestWebgl1: true, | |||
| }, | |||
| }) | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||
| baselayer.defaultBrightness = 0.1 | |||
| viewer.addBaseLayer(baselayer) | |||
| viewer.scene.canvas.setAttribute('tabIndex', 0) | |||
| viewer.flyToPosition( | |||
| new DC.Position(108.198353, 20.758452, 10733735.96, 0, -90, 0), | |||
| () => { | |||
| let chartLayer = new DC.ChartLayer('layer') | |||
| chartLayer.setOption(getOption()) | |||
| viewer.addLayer(chartLayer) | |||
| } | |||
| ) | |||
| } | |||
| function getOption(e) { | |||
| var geoCoordMap = { | |||
| 上海: [121.4648, 31.2891], | |||
| 东莞: [113.8953, 22.901], | |||
| 东营: [118.7073, 37.5513], | |||
| 中山: [113.4229, 22.478], | |||
| 临汾: [111.4783, 36.1615], | |||
| 临沂: [118.3118, 35.2936], | |||
| 丹东: [124.541, 40.4242], | |||
| 丽水: [119.5642, 28.1854], | |||
| 乌鲁木齐: [87.9236, 43.5883], | |||
| 佛山: [112.8955, 23.1097], | |||
| 保定: [115.0488, 39.0948], | |||
| 兰州: [103.5901, 36.3043], | |||
| 包头: [110.3467, 41.4899], | |||
| 北京: [116.4551, 40.2539], | |||
| 北海: [109.314, 21.6211], | |||
| 南京: [118.8062, 31.9208], | |||
| 南宁: [108.479, 23.1152], | |||
| 南昌: [116.0046, 28.6633], | |||
| 赣州: [116.0046, 25.6633], | |||
| 南通: [121.1023, 32.1625], | |||
| 厦门: [118.1689, 24.6478], | |||
| 台州: [121.1353, 28.6688], | |||
| 合肥: [117.29, 32.0581], | |||
| 呼和浩特: [111.4124, 40.4901], | |||
| 咸阳: [108.4131, 34.8706], | |||
| 哈尔滨: [127.9688, 45.368], | |||
| 唐山: [118.4766, 39.6826], | |||
| 嘉兴: [120.9155, 30.6354], | |||
| 大同: [113.7854, 39.8035], | |||
| 大连: [122.2229, 39.4409], | |||
| 天津: [117.4219, 39.4189], | |||
| 太原: [112.3352, 37.9413], | |||
| 威海: [121.9482, 37.1393], | |||
| 宁波: [121.5967, 29.6466], | |||
| 宝鸡: [107.1826, 34.3433], | |||
| 宿迁: [118.5535, 33.7775], | |||
| 宿州: [117.5535, 33.7775], | |||
| 常州: [119.4543, 31.5582], | |||
| 广州: [113.5107, 23.2196], | |||
| 廊坊: [116.521, 39.0509], | |||
| 延安: [109.1052, 36.4252], | |||
| 张家口: [115.1477, 40.8527], | |||
| 徐州: [117.5208, 34.3268], | |||
| 德州: [116.6858, 37.2107], | |||
| 惠州: [114.6204, 23.1647], | |||
| 成都: [103.9526, 30.7617], | |||
| 扬州: [119.4653, 32.8162], | |||
| 承德: [117.5757, 41.4075], | |||
| 拉萨: [91.1865, 30.1465], | |||
| 无锡: [120.3442, 31.5527], | |||
| 日照: [119.2786, 35.5023], | |||
| 昆明: [102.9199, 25.4663], | |||
| 杭州: [119.5313, 29.8773], | |||
| 枣庄: [117.323, 34.8926], | |||
| 曲阜: [117.323, 35.8926], | |||
| 柳州: [109.3799, 24.9774], | |||
| 株洲: [113.5327, 27.0319], | |||
| 武汉: [114.3896, 30.6628], | |||
| 汕头: [117.1692, 23.3405], | |||
| 江门: [112.6318, 22.1484], | |||
| 沈阳: [123.1238, 42.1216], | |||
| 沧州: [116.8286, 38.2104], | |||
| 河源: [114.917, 23.9722], | |||
| 泉州: [118.3228, 25.1147], | |||
| 泰安: [117.0264, 36.0516], | |||
| 泰州: [120.0586, 32.5525], | |||
| 济南: [117.1582, 36.8701], | |||
| 济宁: [116.8286, 35.3375], | |||
| 海口: [110.3893, 19.8516], | |||
| 淄博: [118.0371, 36.6064], | |||
| 淮安: [118.927, 33.4039], | |||
| 深圳: [114.5435, 22.5439], | |||
| 清远: [112.9175, 24.3292], | |||
| 温州: [120.498, 27.8119], | |||
| 渭南: [109.7864, 35.0299], | |||
| 湖州: [119.8608, 30.7782], | |||
| 湘潭: [112.5439, 27.7075], | |||
| 滨州: [117.8174, 37.4963], | |||
| 潍坊: [119.0918, 36.524], | |||
| 烟台: [120.7397, 37.5128], | |||
| 玉溪: [101.9312, 23.8898], | |||
| 珠海: [113.7305, 22.1155], | |||
| 盐城: [120.2234, 33.5577], | |||
| 盘锦: [121.9482, 41.0449], | |||
| 石家庄: [114.4995, 38.1006], | |||
| 福州: [119.4543, 25.9222], | |||
| 秦皇岛: [119.2126, 40.0232], | |||
| 绍兴: [120.564, 29.7565], | |||
| 聊城: [115.9167, 36.4032], | |||
| 肇庆: [112.1265, 23.5822], | |||
| 舟山: [122.2559, 30.2234], | |||
| 苏州: [120.6519, 31.3989], | |||
| 莱芜: [117.6526, 36.2714], | |||
| 菏泽: [115.6201, 35.2057], | |||
| 营口: [122.4316, 40.4297], | |||
| 葫芦岛: [120.1575, 40.578], | |||
| 衡水: [115.8838, 37.7161], | |||
| 衢州: [118.6853, 28.8666], | |||
| 西宁: [101.4038, 36.8207], | |||
| 西安: [109.1162, 34.2004], | |||
| 贵阳: [106.6992, 26.7682], | |||
| 连云港: [119.1248, 34.552], | |||
| 邢台: [114.8071, 37.2821], | |||
| 邯郸: [114.4775, 36.535], | |||
| 郑州: [113.4668, 34.6234], | |||
| 鄂尔多斯: [108.9734, 39.2487], | |||
| 重庆: [107.7539, 30.1904], | |||
| 金华: [120.0037, 29.1028], | |||
| 铜川: [109.0393, 35.1947], | |||
| 银川: [106.3586, 38.1775], | |||
| 镇江: [119.4763, 31.9702], | |||
| 长春: [125.8154, 44.2584], | |||
| 长沙: [113.0823, 28.2568], | |||
| 长治: [112.8625, 36.4746], | |||
| 阳泉: [113.4778, 38.0951], | |||
| 青岛: [120.4651, 36.3373], | |||
| 韶关: [113.7964, 24.7028] | |||
| } | |||
| var chatData = [ | |||
| [ | |||
| '北京', | |||
| [ | |||
| [ | |||
| { | |||
| name: '北京', | |||
| value: 100 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '上海', | |||
| value: 30 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '广州', | |||
| value: 20 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '大连', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '青岛', | |||
| value: 20 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '石家庄', | |||
| value: 20 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '南昌', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '合肥', | |||
| value: 30 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '呼和浩特', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '宿州', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '曲阜', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '杭州', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '武汉', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '深圳', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '珠海', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '福州', | |||
| value: 20 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '西安', | |||
| value: 60 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '赣州', | |||
| value: 10 | |||
| }, | |||
| { | |||
| name: '无锡' | |||
| } | |||
| ] | |||
| ] | |||
| ] | |||
| ] | |||
| var convertData = function(data) { | |||
| var res = [] | |||
| for (let i = 0; i < data.length; i++) { | |||
| var dataItem = data[i] | |||
| var fromCoord = geoCoordMap[dataItem[0].name] | |||
| var toCoord = geoCoordMap[dataItem[1].name] | |||
| if (fromCoord && toCoord) { | |||
| res.push({ | |||
| fromName: dataItem[0].name, | |||
| toName: dataItem[1].name, | |||
| coords: [fromCoord, toCoord], | |||
| value: dataItem[1].value | |||
| }) | |||
| } | |||
| } | |||
| return res | |||
| } | |||
| let n = [] | |||
| chatData.forEach(function(e, a) { | |||
| n.push( | |||
| { | |||
| name: e[2], | |||
| type: 'lines', | |||
| coordinateSystem: 'GLMap', | |||
| effect: { | |||
| show: !0, | |||
| period: 6, | |||
| trailLength: 0.1, | |||
| symbol: 'arrow', | |||
| symbolSize: 5 | |||
| }, | |||
| lineStyle: { | |||
| normal: { | |||
| color: '#60ff44', | |||
| width: 1, | |||
| opacity: 0.4, | |||
| curveness: 0.2 | |||
| } | |||
| }, | |||
| data: convertData(e[1]) | |||
| }, | |||
| { | |||
| type: 'effectScatter', | |||
| coordinateSystem: 'GLMap', | |||
| rippleEffect: { | |||
| brushType: 'stroke' | |||
| }, | |||
| label: { | |||
| normal: { | |||
| show: !0, | |||
| position: 'right', | |||
| formatter: '{b}' | |||
| } | |||
| }, | |||
| symbolSize: function(e) { | |||
| return 3 + e[2] / 10 | |||
| }, | |||
| itemStyle: { | |||
| normal: { | |||
| color: '#60ff44' | |||
| } | |||
| }, | |||
| data: e[1].map(function(e) { | |||
| return { | |||
| name: e[0].name, | |||
| value: geoCoordMap[e[0].name].concat([e[0].value]) | |||
| } | |||
| }) | |||
| } | |||
| ) | |||
| }) | |||
| return { | |||
| animation: false, | |||
| GLMap: {}, | |||
| series: n | |||
| } | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,319 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.chart.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| viewer.scene.canvas.setAttribute('tabIndex', 0) | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||
| baselayer.defaultBrightness = 0.1 | |||
| viewer.addBaseLayer(baselayer) | |||
| viewer.flyToPosition( | |||
| new DC.Position(108.198353, 20.758452, 10733735.96, 0, -90, 0), | |||
| () => { | |||
| let chartLayer = new DC.ChartLayer('layer').addTo(viewer) | |||
| chartLayer.setOption(getOption()) | |||
| } | |||
| ) | |||
| } | |||
| function getOption(e) { | |||
| var chinaGeoCoordMap = { | |||
| '黑龙江': [127.9688, 45.368], | |||
| '大庆': [126.9688, 45.868], | |||
| '内蒙古': [110.3467, 41.4899], | |||
| "吉林": [125.8154, 44.2584], | |||
| '北京': [116.4551, 40.2539], | |||
| "辽宁": [123.1238, 42.1216], | |||
| "河北": [114.4995, 38.1006], | |||
| "天津": [117.4219, 39.4189], | |||
| "山西": [112.3352, 37.9413], | |||
| "陕西": [109.1162, 34.2004], | |||
| "甘肃": [103.5901, 36.3043], | |||
| "宁夏": [106.3586, 38.1775], | |||
| "青海": [101.4038, 36.8207], | |||
| "新疆": [87.9236, 43.5883], | |||
| "西藏": [91.11, 29.97], | |||
| "四川": [103.9526, 30.7617], | |||
| "重庆": [108.384366, 30.439702], | |||
| "山东": [117.1582, 36.8701], | |||
| "河南": [113.4668, 34.6234], | |||
| "江苏": [118.8062, 31.9208], | |||
| "安徽": [117.29, 32.0581], | |||
| "湖北": [114.3896, 30.6628], | |||
| "浙江": [119.5313, 29.8773], | |||
| "福建": [119.4543, 25.9222], | |||
| "江西": [116.0046, 28.6633], | |||
| "湖南": [113.0823, 28.2568], | |||
| "贵州": [106.6992, 26.7682], | |||
| "云南": [102.9199, 25.4663], | |||
| "广东": [113.12244, 23.009505], | |||
| "广西": [108.479, 23.1152], | |||
| "海南": [110.3893, 19.8516], | |||
| '上海': [121.4648, 31.2891] | |||
| }; | |||
| var chinaDatas = [ | |||
| [{ | |||
| name: '黑龙江', | |||
| value: 0.88 | |||
| }], | |||
| [{ | |||
| name: '内蒙古', | |||
| value: 0.12 | |||
| }], | |||
| [{ | |||
| name: '吉林', | |||
| value: 0.89 | |||
| }], | |||
| [{ | |||
| name: '辽宁', | |||
| value: 0.86 | |||
| }], | |||
| [{ | |||
| name: '河北', | |||
| value: 0.88 | |||
| }], | |||
| [{ | |||
| name: '北京', | |||
| value: 0.83 | |||
| }], | |||
| [{ | |||
| name: '天津', | |||
| value: 0.71 | |||
| }], | |||
| [{ | |||
| name: '山西', | |||
| value: 0.63 | |||
| }], | |||
| [{ | |||
| name: '陕西', | |||
| value: 0.56 | |||
| }], | |||
| [{ | |||
| name: '宁夏', | |||
| value: 0.17 | |||
| }], | |||
| [{ | |||
| name: '云南', | |||
| value: 0.11 | |||
| }], | |||
| [{ | |||
| name: '四川', | |||
| value: 1 | |||
| }], | |||
| [{ | |||
| name: '重庆', | |||
| value: 0.80 | |||
| }], | |||
| [{ | |||
| name: '山东', | |||
| value: 0.77 | |||
| }], | |||
| [{ | |||
| name: '河南', | |||
| value: 0.75 | |||
| }], | |||
| [{ | |||
| name: '江苏', | |||
| value: 0.88 | |||
| }], | |||
| [{ | |||
| name: '安徽', | |||
| value: 0.73 | |||
| }], | |||
| [{ | |||
| name: '湖北', | |||
| value: 0.75 | |||
| }], | |||
| [{ | |||
| name: '浙江', | |||
| value: 0.82 | |||
| }], | |||
| [{ | |||
| name: '福建', | |||
| value: 0.67 | |||
| }], | |||
| [{ | |||
| name: '江西', | |||
| value: 0.71 | |||
| }], | |||
| [{ | |||
| name: '湖南', | |||
| value: 0.75 | |||
| }], | |||
| [{ | |||
| name: '广东', | |||
| value: 0.78 | |||
| }], | |||
| [{ | |||
| name: '海南', | |||
| value: 0.1 | |||
| }], | |||
| [{ | |||
| name: '新疆', | |||
| value: 0 | |||
| }], | |||
| [{ | |||
| name: '上海', | |||
| value: 0.91 | |||
| }] | |||
| ]; | |||
| var convertData = function(data) { | |||
| var res = []; | |||
| for (var i = 0; i < data.length; i++) { | |||
| var dataItem = data[i]; | |||
| var fromCoord = chinaGeoCoordMap[dataItem[0].name]; | |||
| var toCoord = [126.9688, 45.868]; | |||
| if (fromCoord && toCoord) { | |||
| res.push([{ | |||
| coord: fromCoord, | |||
| value: dataItem[0].value | |||
| }, { | |||
| coord: toCoord, | |||
| }]); | |||
| } | |||
| } | |||
| return res; | |||
| }; | |||
| var series = []; | |||
| [ | |||
| ['大庆', chinaDatas] | |||
| ].forEach(function(item, i) { | |||
| console.log(item) | |||
| series.push({ | |||
| type: 'lines', | |||
| zlevel: 2, | |||
| coordinateSystem: 'GLMap', | |||
| effect: { | |||
| show: true, | |||
| period: 4, //箭头指向速度,值越小速度越快 | |||
| trailLength: 0.02, //特效尾迹长度[0,1]值越大,尾迹越长重 | |||
| symbol: 'arrow', //箭头图标 | |||
| symbolSize: 5, //图标大小 | |||
| }, | |||
| lineStyle: { | |||
| normal: { | |||
| width: 1, //尾迹线条宽度 | |||
| opacity: 1, //尾迹线条透明度 | |||
| curveness: .3 //尾迹线条曲直度 | |||
| } | |||
| }, | |||
| data: convertData(item[1]) | |||
| }, { | |||
| type: 'effectScatter', | |||
| coordinateSystem: 'GLMap', | |||
| zlevel: 2, | |||
| rippleEffect: { //涟漪特效 | |||
| period: 4, //动画时间,值越小速度越快 | |||
| brushType: 'stroke', //波纹绘制方式 stroke, fill | |||
| scale: 4 //波纹圆环最大限制,值越大波纹越大 | |||
| }, | |||
| label: { | |||
| normal: { | |||
| show: true, | |||
| position: 'right', //显示位置 | |||
| offset: [5, 0], //偏移设置 | |||
| formatter: function(params) { //圆环显示文字 | |||
| return params.data.name; | |||
| }, | |||
| fontSize: 13 | |||
| }, | |||
| emphasis: { | |||
| show: true | |||
| } | |||
| }, | |||
| symbol: 'circle', | |||
| symbolSize: function(val) { | |||
| return 5 + val[2] * 5; //圆环大小 | |||
| }, | |||
| itemStyle: { | |||
| normal: { | |||
| show: false, | |||
| color: '#f00' | |||
| } | |||
| }, | |||
| data: item[1].map(function(dataItem) { | |||
| return { | |||
| name: dataItem[0].name, | |||
| value: chinaGeoCoordMap[dataItem[0].name].concat([dataItem[0].value]) | |||
| }; | |||
| }), | |||
| }, | |||
| //被攻击点 | |||
| { | |||
| type: 'scatter', | |||
| coordinateSystem: 'GLMap', | |||
| zlevel: 2, | |||
| rippleEffect: { | |||
| period: 4, | |||
| brushType: 'stroke', | |||
| scale: 4 | |||
| }, | |||
| label: { | |||
| normal: { | |||
| show: true, | |||
| position: 'right', | |||
| //offset:[5, 0], | |||
| color: '#0f0', | |||
| formatter: '{b}', | |||
| textStyle: { | |||
| color: "#0f0" | |||
| } | |||
| }, | |||
| emphasis: { | |||
| show: true, | |||
| color: "#f60" | |||
| } | |||
| }, | |||
| symbol: 'pin', | |||
| symbolSize: 50, | |||
| data: [{ | |||
| name: item[0], | |||
| value: chinaGeoCoordMap[item[0]].concat([10]), | |||
| }], | |||
| } | |||
| ); | |||
| }); | |||
| return { | |||
| animation: false, | |||
| GLMap: {}, | |||
| series: series | |||
| } | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,527 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.chart.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||
| baselayer.defaultBrightness = 0.1 | |||
| viewer.addBaseLayer(baselayer) | |||
| viewer.flyToPosition( | |||
| new DC.Position(108.198353, 20.758452, 10733735.96, 0, -90, 0), | |||
| () => { | |||
| let chartLayer = new DC.ChartLayer('layer').addTo(viewer) | |||
| chartLayer.setOption(getOption()) | |||
| } | |||
| ) | |||
| } | |||
| function getOption(e) { | |||
| var chartData = [ | |||
| { name: '海门', value: 9 }, | |||
| { name: '鄂尔多斯', value: 12 }, | |||
| { name: '招远', value: 12 }, | |||
| { name: '舟山', value: 12 }, | |||
| { name: '齐齐哈尔', value: 14 }, | |||
| { name: '盐城', value: 15 }, | |||
| { name: '赤峰', value: 16 }, | |||
| { name: '青岛', value: 18 }, | |||
| { name: '乳山', value: 18 }, | |||
| { name: '金昌', value: 19 }, | |||
| { name: '泉州', value: 21 }, | |||
| { name: '莱西', value: 21 }, | |||
| { name: '日照', value: 21 }, | |||
| { name: '胶南', value: 22 }, | |||
| { name: '南通', value: 23 }, | |||
| { name: '拉萨', value: 24 }, | |||
| { name: '云浮', value: 24 }, | |||
| { name: '梅州', value: 25 }, | |||
| { name: '文登', value: 25 }, | |||
| { name: '上海', value: 25 }, | |||
| { name: '攀枝花', value: 25 }, | |||
| { name: '威海', value: 25 }, | |||
| { name: '承德', value: 25 }, | |||
| { name: '厦门', value: 26 }, | |||
| { name: '汕尾', value: 26 }, | |||
| { name: '潮州', value: 26 }, | |||
| { name: '丹东', value: 27 }, | |||
| { name: '太仓', value: 27 }, | |||
| { name: '曲靖', value: 27 }, | |||
| { name: '烟台', value: 28 }, | |||
| { name: '福州', value: 29 }, | |||
| { name: '瓦房店', value: 30 }, | |||
| { name: '即墨', value: 30 }, | |||
| { name: '抚顺', value: 31 }, | |||
| { name: '玉溪', value: 31 }, | |||
| { name: '张家口', value: 31 }, | |||
| { name: '阳泉', value: 31 }, | |||
| { name: '莱州', value: 32 }, | |||
| { name: '湖州', value: 32 }, | |||
| { name: '汕头', value: 32 }, | |||
| { name: '昆山', value: 33 }, | |||
| { name: '宁波', value: 33 }, | |||
| { name: '湛江', value: 33 }, | |||
| { name: '揭阳', value: 34 }, | |||
| { name: '荣成', value: 34 }, | |||
| { name: '连云港', value: 35 }, | |||
| { name: '葫芦岛', value: 35 }, | |||
| { name: '常熟', value: 36 }, | |||
| { name: '东莞', value: 36 }, | |||
| { name: '河源', value: 36 }, | |||
| { name: '淮安', value: 36 }, | |||
| { name: '泰州', value: 36 }, | |||
| { name: '南宁', value: 37 }, | |||
| { name: '营口', value: 37 }, | |||
| { name: '惠州', value: 37 }, | |||
| { name: '江阴', value: 37 }, | |||
| { name: '蓬莱', value: 37 }, | |||
| { name: '韶关', value: 38 }, | |||
| { name: '嘉峪关', value: 38 }, | |||
| { name: '广州', value: 38 }, | |||
| { name: '延安', value: 38 }, | |||
| { name: '太原', value: 39 }, | |||
| { name: '清远', value: 39 }, | |||
| { name: '中山', value: 39 }, | |||
| { name: '昆明', value: 39 }, | |||
| { name: '寿光', value: 40 }, | |||
| { name: '盘锦', value: 40 }, | |||
| { name: '长治', value: 41 }, | |||
| { name: '深圳', value: 41 }, | |||
| { name: '珠海', value: 42 }, | |||
| { name: '宿迁', value: 43 }, | |||
| { name: '咸阳', value: 43 }, | |||
| { name: '铜川', value: 44 }, | |||
| { name: '平度', value: 44 }, | |||
| { name: '佛山', value: 44 }, | |||
| { name: '海口', value: 44 }, | |||
| { name: '江门', value: 45 }, | |||
| { name: '章丘', value: 45 }, | |||
| { name: '肇庆', value: 46 }, | |||
| { name: '大连', value: 47 }, | |||
| { name: '临汾', value: 47 }, | |||
| { name: '吴江', value: 47 }, | |||
| { name: '石嘴山', value: 49 }, | |||
| { name: '沈阳', value: 50 }, | |||
| { name: '苏州', value: 50 }, | |||
| { name: '茂名', value: 50 }, | |||
| { name: '嘉兴', value: 51 }, | |||
| { name: '长春', value: 51 }, | |||
| { name: '胶州', value: 52 }, | |||
| { name: '银川', value: 52 }, | |||
| { name: '张家港', value: 52 }, | |||
| { name: '三门峡', value: 53 }, | |||
| { name: '锦州', value: 54 }, | |||
| { name: '南昌', value: 54 }, | |||
| { name: '柳州', value: 54 }, | |||
| { name: '三亚', value: 54 }, | |||
| { name: '自贡', value: 56 }, | |||
| { name: '吉林', value: 56 }, | |||
| { name: '阳江', value: 57 }, | |||
| { name: '泸州', value: 57 }, | |||
| { name: '西宁', value: 57 }, | |||
| { name: '宜宾', value: 58 }, | |||
| { name: '呼和浩特', value: 58 }, | |||
| { name: '成都', value: 58 }, | |||
| { name: '大同', value: 58 }, | |||
| { name: '镇江', value: 59 }, | |||
| { name: '桂林', value: 59 }, | |||
| { name: '张家界', value: 59 }, | |||
| { name: '宜兴', value: 59 }, | |||
| { name: '北海', value: 60 }, | |||
| { name: '西安', value: 61 }, | |||
| { name: '金坛', value: 62 }, | |||
| { name: '东营', value: 62 }, | |||
| { name: '牡丹江', value: 63 }, | |||
| { name: '遵义', value: 63 }, | |||
| { name: '绍兴', value: 63 }, | |||
| { name: '扬州', value: 64 }, | |||
| { name: '常州', value: 64 }, | |||
| { name: '潍坊', value: 65 }, | |||
| { name: '重庆', value: 66 }, | |||
| { name: '台州', value: 67 }, | |||
| { name: '南京', value: 67 }, | |||
| { name: '滨州', value: 70 }, | |||
| { name: '贵阳', value: 71 }, | |||
| { name: '无锡', value: 71 }, | |||
| { name: '本溪', value: 71 }, | |||
| { name: '克拉玛依', value: 72 }, | |||
| { name: '渭南', value: 72 }, | |||
| { name: '马鞍山', value: 72 }, | |||
| { name: '宝鸡', value: 72 }, | |||
| { name: '焦作', value: 75 }, | |||
| { name: '句容', value: 75 }, | |||
| { name: '北京', value: 79 }, | |||
| { name: '徐州', value: 79 }, | |||
| { name: '衡水', value: 80 }, | |||
| { name: '包头', value: 80 }, | |||
| { name: '绵阳', value: 80 }, | |||
| { name: '乌鲁木齐', value: 84 }, | |||
| { name: '枣庄', value: 84 }, | |||
| { name: '杭州', value: 84 }, | |||
| { name: '淄博', value: 85 }, | |||
| { name: '鞍山', value: 86 }, | |||
| { name: '溧阳', value: 86 }, | |||
| { name: '库尔勒', value: 86 }, | |||
| { name: '安阳', value: 90 }, | |||
| { name: '开封', value: 90 }, | |||
| { name: '济南', value: 92 }, | |||
| { name: '德阳', value: 93 }, | |||
| { name: '温州', value: 95 }, | |||
| { name: '九江', value: 96 }, | |||
| { name: '邯郸', value: 98 }, | |||
| { name: '临安', value: 99 }, | |||
| { name: '兰州', value: 99 }, | |||
| { name: '沧州', value: 100 }, | |||
| { name: '临沂', value: 103 }, | |||
| { name: '南充', value: 104 }, | |||
| { name: '天津', value: 105 }, | |||
| { name: '富阳', value: 106 }, | |||
| { name: '泰安', value: 112 }, | |||
| { name: '诸暨', value: 112 }, | |||
| { name: '郑州', value: 113 }, | |||
| { name: '哈尔滨', value: 114 }, | |||
| { name: '聊城', value: 116 }, | |||
| { name: '芜湖', value: 117 }, | |||
| { name: '唐山', value: 119 }, | |||
| { name: '平顶山', value: 119 }, | |||
| { name: '邢台', value: 119 }, | |||
| { name: '德州', value: 120 }, | |||
| { name: '济宁', value: 120 }, | |||
| { name: '荆州', value: 127 }, | |||
| { name: '宜昌', value: 130 }, | |||
| { name: '义乌', value: 132 }, | |||
| { name: '丽水', value: 133 }, | |||
| { name: '洛阳', value: 134 }, | |||
| { name: '秦皇岛', value: 136 }, | |||
| { name: '株洲', value: 143 }, | |||
| { name: '石家庄', value: 147 }, | |||
| { name: '莱芜', value: 148 }, | |||
| { name: '常德', value: 152 }, | |||
| { name: '保定', value: 153 }, | |||
| { name: '湘潭', value: 154 }, | |||
| { name: '金华', value: 157 }, | |||
| { name: '岳阳', value: 169 }, | |||
| { name: '长沙', value: 175 }, | |||
| { name: '衢州', value: 177 }, | |||
| { name: '廊坊', value: 193 }, | |||
| { name: '菏泽', value: 194 }, | |||
| { name: '合肥', value: 229 }, | |||
| { name: '武汉', value: 273 }, | |||
| { name: '大庆', value: 279 } | |||
| ] | |||
| var geoCoordMap = { | |||
| 海门: [121.15, 31.89], | |||
| 鄂尔多斯: [109.781327, 39.608266], | |||
| 招远: [120.38, 37.35], | |||
| 舟山: [122.207216, 29.985295], | |||
| 齐齐哈尔: [123.97, 47.33], | |||
| 盐城: [120.13, 33.38], | |||
| 赤峰: [118.87, 42.28], | |||
| 青岛: [120.33, 36.07], | |||
| 乳山: [121.52, 36.89], | |||
| 金昌: [102.188043, 38.520089], | |||
| 泉州: [118.58, 24.93], | |||
| 莱西: [120.53, 36.86], | |||
| 日照: [119.46, 35.42], | |||
| 胶南: [119.97, 35.88], | |||
| 南通: [121.05, 32.08], | |||
| 拉萨: [91.11, 29.97], | |||
| 云浮: [112.02, 22.93], | |||
| 梅州: [116.1, 24.55], | |||
| 文登: [122.05, 37.2], | |||
| 上海: [121.48, 31.22], | |||
| 攀枝花: [101.718637, 26.582347], | |||
| 威海: [122.1, 37.5], | |||
| 承德: [117.93, 40.97], | |||
| 厦门: [118.1, 24.46], | |||
| 汕尾: [115.375279, 22.786211], | |||
| 潮州: [116.63, 23.68], | |||
| 丹东: [124.37, 40.13], | |||
| 太仓: [121.1, 31.45], | |||
| 曲靖: [103.79, 25.51], | |||
| 烟台: [121.39, 37.52], | |||
| 福州: [119.3, 26.08], | |||
| 瓦房店: [121.979603, 39.627114], | |||
| 即墨: [120.45, 36.38], | |||
| 抚顺: [123.97, 41.97], | |||
| 玉溪: [102.52, 24.35], | |||
| 张家口: [114.87, 40.82], | |||
| 阳泉: [113.57, 37.85], | |||
| 莱州: [119.942327, 37.177017], | |||
| 湖州: [120.1, 30.86], | |||
| 汕头: [116.69, 23.39], | |||
| 昆山: [120.95, 31.39], | |||
| 宁波: [121.56, 29.86], | |||
| 湛江: [110.359377, 21.270708], | |||
| 揭阳: [116.35, 23.55], | |||
| 荣成: [122.41, 37.16], | |||
| 连云港: [119.16, 34.59], | |||
| 葫芦岛: [120.836932, 40.711052], | |||
| 常熟: [120.74, 31.64], | |||
| 东莞: [113.75, 23.04], | |||
| 河源: [114.68, 23.73], | |||
| 淮安: [119.15, 33.5], | |||
| 泰州: [119.9, 32.49], | |||
| 南宁: [108.33, 22.84], | |||
| 营口: [122.18, 40.65], | |||
| 惠州: [114.4, 23.09], | |||
| 江阴: [120.26, 31.91], | |||
| 蓬莱: [120.75, 37.8], | |||
| 韶关: [113.62, 24.84], | |||
| 嘉峪关: [98.289152, 39.77313], | |||
| 广州: [113.23, 23.16], | |||
| 延安: [109.47, 36.6], | |||
| 太原: [112.53, 37.87], | |||
| 清远: [113.01, 23.7], | |||
| 中山: [113.38, 22.52], | |||
| 昆明: [102.73, 25.04], | |||
| 寿光: [118.73, 36.86], | |||
| 盘锦: [122.070714, 41.119997], | |||
| 长治: [113.08, 36.18], | |||
| 深圳: [114.07, 22.62], | |||
| 珠海: [113.52, 22.3], | |||
| 宿迁: [118.3, 33.96], | |||
| 咸阳: [108.72, 34.36], | |||
| 铜川: [109.11, 35.09], | |||
| 平度: [119.97, 36.77], | |||
| 佛山: [113.11, 23.05], | |||
| 海口: [110.35, 20.02], | |||
| 江门: [113.06, 22.61], | |||
| 章丘: [117.53, 36.72], | |||
| 肇庆: [112.44, 23.05], | |||
| 大连: [121.62, 38.92], | |||
| 临汾: [111.5, 36.08], | |||
| 吴江: [120.63, 31.16], | |||
| 石嘴山: [106.39, 39.04], | |||
| 沈阳: [123.38, 41.8], | |||
| 苏州: [120.62, 31.32], | |||
| 茂名: [110.88, 21.68], | |||
| 嘉兴: [120.76, 30.77], | |||
| 长春: [125.35, 43.88], | |||
| 胶州: [120.03336, 36.264622], | |||
| 银川: [106.27, 38.47], | |||
| 张家港: [120.555821, 31.875428], | |||
| 三门峡: [111.19, 34.76], | |||
| 锦州: [121.15, 41.13], | |||
| 南昌: [115.89, 28.68], | |||
| 柳州: [109.4, 24.33], | |||
| 三亚: [109.511909, 18.252847], | |||
| 自贡: [104.778442, 29.33903], | |||
| 吉林: [126.57, 43.87], | |||
| 阳江: [111.95, 21.85], | |||
| 泸州: [105.39, 28.91], | |||
| 西宁: [101.74, 36.56], | |||
| 宜宾: [104.56, 29.77], | |||
| 呼和浩特: [111.65, 40.82], | |||
| 成都: [104.06, 30.67], | |||
| 大同: [113.3, 40.12], | |||
| 镇江: [119.44, 32.2], | |||
| 桂林: [110.28, 25.29], | |||
| 张家界: [110.479191, 29.117096], | |||
| 宜兴: [119.82, 31.36], | |||
| 北海: [109.12, 21.49], | |||
| 西安: [108.95, 34.27], | |||
| 金坛: [119.56, 31.74], | |||
| 东营: [118.49, 37.46], | |||
| 牡丹江: [129.58, 44.6], | |||
| 遵义: [106.9, 27.7], | |||
| 绍兴: [120.58, 30.01], | |||
| 扬州: [119.42, 32.39], | |||
| 常州: [119.95, 31.79], | |||
| 潍坊: [119.1, 36.62], | |||
| 重庆: [106.54, 29.59], | |||
| 台州: [121.420757, 28.656386], | |||
| 南京: [118.78, 32.04], | |||
| 滨州: [118.03, 37.36], | |||
| 贵阳: [106.71, 26.57], | |||
| 无锡: [120.29, 31.59], | |||
| 本溪: [123.73, 41.3], | |||
| 克拉玛依: [84.77, 45.59], | |||
| 渭南: [109.5, 34.52], | |||
| 马鞍山: [118.48, 31.56], | |||
| 宝鸡: [107.15, 34.38], | |||
| 焦作: [113.21, 35.24], | |||
| 句容: [119.16, 31.95], | |||
| 北京: [116.46, 39.92], | |||
| 徐州: [117.2, 34.26], | |||
| 衡水: [115.72, 37.72], | |||
| 包头: [110, 40.58], | |||
| 绵阳: [104.73, 31.48], | |||
| 乌鲁木齐: [87.68, 43.77], | |||
| 枣庄: [117.57, 34.86], | |||
| 杭州: [120.19, 30.26], | |||
| 淄博: [118.05, 36.78], | |||
| 鞍山: [122.85, 41.12], | |||
| 溧阳: [119.48, 31.43], | |||
| 库尔勒: [86.06, 41.68], | |||
| 安阳: [114.35, 36.1], | |||
| 开封: [114.35, 34.79], | |||
| 济南: [117, 36.65], | |||
| 德阳: [104.37, 31.13], | |||
| 温州: [120.65, 28.01], | |||
| 九江: [115.97, 29.71], | |||
| 邯郸: [114.47, 36.6], | |||
| 临安: [119.72, 30.23], | |||
| 兰州: [103.73, 36.03], | |||
| 沧州: [116.83, 38.33], | |||
| 临沂: [118.35, 35.05], | |||
| 南充: [106.110698, 30.837793], | |||
| 天津: [117.2, 39.13], | |||
| 富阳: [119.95, 30.07], | |||
| 泰安: [117.13, 36.18], | |||
| 诸暨: [120.23, 29.71], | |||
| 郑州: [113.65, 34.76], | |||
| 哈尔滨: [126.63, 45.75], | |||
| 聊城: [115.97, 36.45], | |||
| 芜湖: [118.38, 31.33], | |||
| 唐山: [118.02, 39.63], | |||
| 平顶山: [113.29, 33.75], | |||
| 邢台: [114.48, 37.05], | |||
| 德州: [116.29, 37.45], | |||
| 济宁: [116.59, 35.38], | |||
| 荆州: [112.239741, 30.335165], | |||
| 宜昌: [111.3, 30.7], | |||
| 义乌: [120.06, 29.32], | |||
| 丽水: [119.92, 28.45], | |||
| 洛阳: [112.44, 34.7], | |||
| 秦皇岛: [119.57, 39.95], | |||
| 株洲: [113.16, 27.83], | |||
| 石家庄: [114.48, 38.03], | |||
| 莱芜: [117.67, 36.19], | |||
| 常德: [111.69, 29.05], | |||
| 保定: [115.48, 38.85], | |||
| 湘潭: [112.91, 27.87], | |||
| 金华: [119.64, 29.12], | |||
| 岳阳: [113.09, 29.37], | |||
| 长沙: [113, 28.21], | |||
| 衢州: [118.88, 28.97], | |||
| 廊坊: [116.7, 39.53], | |||
| 菏泽: [115.480656, 35.23375], | |||
| 合肥: [117.27, 31.86], | |||
| 武汉: [114.31, 30.52], | |||
| 大庆: [125.03, 46.58] | |||
| } | |||
| var convertData = function(data) { | |||
| var res = [] | |||
| for (var i = 0; i < data.length; i++) { | |||
| var geoCoord = geoCoordMap[data[i].name] | |||
| if (geoCoord) { | |||
| res.push({ | |||
| name: data[i].name, | |||
| value: geoCoord.concat(data[i].value) | |||
| }) | |||
| } | |||
| } | |||
| return res | |||
| } | |||
| return { | |||
| title: { | |||
| text: '全国主要城市空气质量', | |||
| subtext: 'data from PM25.in', | |||
| sublink: 'http://www.pm25.in', | |||
| left: 'center', | |||
| textStyle: { | |||
| color: '#fff' | |||
| } | |||
| }, | |||
| animation: false, | |||
| GLMap: {}, | |||
| series: [ | |||
| { | |||
| name: 'pm2.5', | |||
| type: 'scatter', | |||
| coordinateSystem: 'GLMap', | |||
| data: convertData(chartData), | |||
| symbolSize: function(val) { | |||
| return val[2] / 10 | |||
| }, | |||
| label: { | |||
| normal: { | |||
| formatter: '{b}', | |||
| position: 'right', | |||
| show: false | |||
| }, | |||
| emphasis: { | |||
| show: true | |||
| } | |||
| }, | |||
| itemStyle: { | |||
| normal: { | |||
| color: '#ddb926' | |||
| } | |||
| } | |||
| }, | |||
| { | |||
| name: 'Top 5', | |||
| type: 'effectScatter', | |||
| coordinateSystem: 'GLMap', | |||
| data: convertData( | |||
| chartData | |||
| .sort(function(a, b) { | |||
| return b.value - a.value | |||
| }) | |||
| .slice(0, 6) | |||
| ), | |||
| symbolSize: function(val) { | |||
| return val[2] / 10 | |||
| }, | |||
| showEffectOn: 'render', | |||
| rippleEffect: { | |||
| brushType: 'stroke' | |||
| }, | |||
| hoverAnimation: true, | |||
| label: { | |||
| normal: { | |||
| formatter: '{b}', | |||
| position: 'right', | |||
| show: true | |||
| } | |||
| }, | |||
| itemStyle: { | |||
| normal: { | |||
| color: '#f4e925', | |||
| shadowBlur: 10, | |||
| shadowColor: '#333' | |||
| } | |||
| }, | |||
| zlevel: 1 | |||
| } | |||
| ] | |||
| } | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| </body> | |||
| </html> | |||
| @@ -0,0 +1,646 @@ | |||
| <!DOCTYPE html> | |||
| <html lang="en"> | |||
| <head> | |||
| <meta charset="utf-8"> | |||
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | |||
| <title>dc-example</title> | |||
| <script src='https://cdn.jsdelivr.net/npm/echarts@5.4.2/dist/echarts.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.base.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.core.min.js'></script> | |||
| <script src='/libs/dc-sdk/dc.chart.min.js'></script> | |||
| <script>DC.baseUrl='../libs/dc-sdk/resources/'</script> | |||
| <link href='/libs/dc-sdk/dc.core.min.css' type='text/css' rel='stylesheet'> | |||
| <link href='../index.css' type='text/css' rel='stylesheet'> | |||
| <style> | |||
| *{ | |||
| margin: 0; | |||
| padding: 0; | |||
| } | |||
| html,body,#viewer-container{ | |||
| width: 100%; | |||
| height: 100%; | |||
| overflow: hidden; | |||
| } | |||
| </style> | |||
| </head> | |||
| <body> | |||
| <div id="viewer-container"></div> | |||
| <script> | |||
| let viewer = undefined | |||
| function initViewer() { | |||
| viewer = new DC.Viewer('viewer-container') | |||
| let baselayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||
| baselayer.defaultBrightness = 0.1 | |||
| viewer.addBaseLayer(baselayer) | |||
| viewer.flyToPosition( | |||
| new DC.Position(108.198353, 20.758452, 10733735.96, 0, -90, 0), | |||
| () => { | |||
| let chartLayer = new DC.ChartLayer('layer').addTo(viewer) | |||
| chartLayer.setOption(getOption()) | |||
| } | |||
| ) | |||
| } | |||
| function getOption(e) { | |||
| var geoCoordMap = { | |||
| 新疆玛纳斯基地: [86.22, 44.3], | |||
| 九江: [116.0, 29.7], | |||
| 新乡: [116.402217, 35.311657], | |||
| ' ': [79.92, 37.12], | |||
| ' ': [86.85, 47.7], | |||
| 若羌县: [88.17, 39.02], | |||
| 上海: [121.4648, 31.2891], | |||
| 东莞: [113.8953, 22.901], | |||
| 东营: [118.7073, 37.5513], | |||
| 中山: [113.4229, 22.478], | |||
| 临汾: [111.4783, 36.1615], | |||
| 临沂: [118.3118, 35.2936], | |||
| 丹东: [124.541, 40.4242], | |||
| 丽水: [119.5642, 28.1854], | |||
| 乌鲁木齐: [87.9236, 43.5883], | |||
| 佛山: [112.8955, 23.1097], | |||
| 保定: [115.0488, 39.0948], | |||
| 兰州: [103.5901, 36.3043], | |||
| 包头: [110.3467, 41.4899], | |||
| 北京: [116.4551, 40.2539], | |||
| 北海: [109.314, 21.6211], | |||
| 南京: [118.8062, 31.9208], | |||
| 南宁: [108.479, 23.1152], | |||
| 南昌: [116.0046, 28.6633], | |||
| 南通: [121.1023, 32.1625], | |||
| 厦门: [118.1689, 24.6478], | |||
| 台州: [121.1353, 28.6688], | |||
| 合肥: [117.29, 32.0581], | |||
| 呼和浩特: [111.4124, 40.4901], | |||
| 咸阳: [108.4131, 34.8706], | |||
| 哈尔滨: [127.9688, 45.368], | |||
| 唐山: [118.4766, 39.6826], | |||
| 嘉兴: [120.9155, 30.6354], | |||
| 大同: [113.7854, 39.8035], | |||
| 大连: [122.2229, 39.4409], | |||
| 天津: [117.4219, 39.4189], | |||
| 太原: [112.3352, 37.9413], | |||
| 威海: [121.9482, 37.1393], | |||
| 宁波: [121.5967, 29.6466], | |||
| 宝鸡: [107.1826, 34.3433], | |||
| 宿迁: [118.5535, 33.7775], | |||
| 常州: [119.4543, 31.5582], | |||
| 广州: [113.5107, 23.2196], | |||
| 廊坊: [116.521, 39.0509], | |||
| 延安: [109.1052, 36.4252], | |||
| 张家口: [115.1477, 40.8527], | |||
| 徐州: [117.5208, 34.3268], | |||
| 德州: [116.6858, 37.2107], | |||
| 惠州: [114.6204, 23.1647], | |||
| 成都: [103.9526, 30.7617], | |||
| 扬州: [119.4653, 32.8162], | |||
| 承德: [117.5757, 41.4075], | |||
| 拉萨: [91.1865, 30.1465], | |||
| 无锡: [120.3442, 31.5527], | |||
| 日照: [119.2786, 35.5023], | |||
| 昆明: [102.9199, 25.4663], | |||
| 杭州: [119.5313, 29.8773], | |||
| 枣庄: [117.323, 34.8926], | |||
| 柳州: [109.3799, 24.9774], | |||
| 株洲: [113.5327, 27.0319], | |||
| 武汉: [114.3896, 30.6628], | |||
| 汕头: [117.1692, 23.3405], | |||
| 江门: [112.6318, 22.1484], | |||
| 沈阳: [123.1238, 42.1216], | |||
| 沧州: [116.8286, 38.2104], | |||
| 河源: [114.917, 23.9722], | |||
| 泉州: [118.3228, 25.1147], | |||
| 泰安: [117.0264, 36.0516], | |||
| 泰州: [120.0586, 32.5525], | |||
| 济南: [117.1582, 36.8701], | |||
| 济宁: [116.8286, 35.3375], | |||
| 海口: [110.3893, 19.8516], | |||
| 淄博: [118.0371, 36.6064], | |||
| 淮安: [118.927, 33.4039], | |||
| 深圳: [114.5435, 22.5439], | |||
| 清远: [112.9175, 24.3292], | |||
| 温州: [120.498, 27.8119], | |||
| 渭南: [109.7864, 35.0299], | |||
| 湖州: [119.8608, 30.7782], | |||
| 湘潭: [112.5439, 27.7075], | |||
| 滨州: [117.8174, 37.4963], | |||
| 潍坊: [119.0918, 36.524], | |||
| 烟台: [120.7397, 37.5128], | |||
| 玉溪: [101.9312, 23.8898], | |||
| 珠海: [113.7305, 22.1155], | |||
| 盐城: [120.2234, 33.5577], | |||
| 盘锦: [121.9482, 41.0449], | |||
| 石家庄: [114.4995, 38.1006], | |||
| 福州: [119.4543, 25.9222], | |||
| 秦皇岛: [119.2126, 40.0232], | |||
| 绍兴: [120.564, 29.7565], | |||
| 聊城: [115.9167, 36.4032], | |||
| 肇庆: [112.1265, 23.5822], | |||
| 舟山: [122.2559, 30.2234], | |||
| 苏州: [120.6519, 31.3989], | |||
| 莱芜: [117.6526, 36.2714], | |||
| 菏泽: [115.6201, 35.2057], | |||
| 营口: [122.4316, 40.4297], | |||
| 葫芦岛: [120.1575, 40.578], | |||
| 衡水: [115.8838, 37.7161], | |||
| 衢州: [118.6853, 28.8666], | |||
| 西宁: [101.4038, 36.8207], | |||
| 西安: [109.1162, 34.2004], | |||
| 贵阳: [106.6992, 26.7682], | |||
| 连云港: [119.1248, 34.552], | |||
| 邢台: [114.8071, 37.2821], | |||
| 邯郸: [114.4775, 36.535], | |||
| 郑州: [113.4668, 34.6234], | |||
| 鄂尔多斯: [108.9734, 39.2487], | |||
| 重庆: [107.7539, 30.1904], | |||
| 金华: [120.0037, 29.1028], | |||
| 铜川: [109.0393, 35.1947], | |||
| 银川: [106.3586, 38.1775], | |||
| 镇江: [119.4763, 31.9702], | |||
| 长春: [125.8154, 44.2584], | |||
| 长沙: [113.0823, 28.2568], | |||
| 长治: [112.8625, 36.4746], | |||
| 阳泉: [113.4778, 38.0951], | |||
| 青岛: [120.4651, 36.3373], | |||
| 韶关: [113.7964, 24.7028] | |||
| } | |||
| var BJData = [ | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '新乡', | |||
| value: 200 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '呼和浩特', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '哈尔滨', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '石家庄', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '昆明', | |||
| value: 30 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '北京', | |||
| value: 100 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '长春', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '重庆', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '贵阳', | |||
| value: 50 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '南宁', | |||
| value: 30 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '济南', | |||
| value: 10 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '太原', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '西安', | |||
| value: 60 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '武汉', | |||
| value: 50 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '合肥', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '南京', | |||
| value: 30 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '沈阳', | |||
| value: 20 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新乡' | |||
| }, | |||
| { | |||
| name: '成都', | |||
| value: 10 | |||
| } | |||
| ] | |||
| ] | |||
| var SHData = [ | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '九江', | |||
| value: 200 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '长沙', | |||
| value: 95 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '武汉', | |||
| value: 30 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '南昌', | |||
| value: 20 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '合肥', | |||
| value: 70 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '南京', | |||
| value: 60 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '福州', | |||
| value: 50 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '上海', | |||
| value: 100 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '九江' | |||
| }, | |||
| { | |||
| name: '深圳', | |||
| value: 100 | |||
| } | |||
| ] | |||
| ] | |||
| var GZData = [ | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '新疆玛纳斯基地', | |||
| value: 200 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: ' ', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: ' ', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '呼和浩特', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '昆明', | |||
| value: 40 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '成都', | |||
| value: 10 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '兰州', | |||
| value: 95 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '银川', | |||
| value: 90 | |||
| } | |||
| ], | |||
| [ | |||
| { | |||
| name: '新疆玛纳斯基地' | |||
| }, | |||
| { | |||
| name: '西宁', | |||
| value: 80 | |||
| } | |||
| ] | |||
| ] | |||
| var planePath = | |||
| 'path://M.6,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705' | |||
| var convertData = function(data) { | |||
| var res = [] | |||
| for (var i = 0; i < data.length; i++) { | |||
| var dataItem = data[i] | |||
| var fromCoord = geoCoordMap[dataItem[0].name] | |||
| var toCoord = geoCoordMap[dataItem[1].name] | |||
| if (fromCoord && toCoord) { | |||
| res.push([ | |||
| { | |||
| coord: fromCoord | |||
| }, | |||
| { | |||
| coord: toCoord | |||
| } | |||
| ]) | |||
| } | |||
| } | |||
| return res | |||
| } | |||
| var color = ['#3ed4ff', '#ffa022', '#a6c84c'] | |||
| var series = [] | |||
| ;[ | |||
| ['新乡', BJData], | |||
| ['九江', SHData], | |||
| ['新疆', GZData] | |||
| ].forEach(function(item, i) { | |||
| series.push( | |||
| { | |||
| name: item[0] + ' Top10', | |||
| type: 'lines', | |||
| coordinateSystem: 'GLMap', | |||
| zlevel: 1, | |||
| effect: { | |||
| show: true, | |||
| period: 6, | |||
| trailLength: 0.7, | |||
| color: '#fff', | |||
| symbolSize: 3 | |||
| }, | |||
| lineStyle: { | |||
| normal: { | |||
| color: color[i], | |||
| width: 0, | |||
| curveness: 0.2 | |||
| } | |||
| }, | |||
| data: convertData(item[1]) | |||
| }, | |||
| { | |||
| name: item[0] + ' Top10', | |||
| type: 'lines', | |||
| coordinateSystem: 'GLMap', | |||
| zlevel: 2, | |||
| effect: { | |||
| show: true, | |||
| period: 6, | |||
| trailLength: 0, | |||
| symbol: planePath, | |||
| symbolSize: 15 | |||
| }, | |||
| lineStyle: { | |||
| normal: { | |||
| color: color[i], | |||
| width: 1, | |||
| opacity: 0.4, | |||
| curveness: 0.2 | |||
| } | |||
| }, | |||
| data: convertData(item[1]) | |||
| }, | |||
| { | |||
| name: item[0] + ' Top10', | |||
| type: 'effectScatter', | |||
| coordinateSystem: 'GLMap', | |||
| zlevel: 2, | |||
| rippleEffect: { | |||
| brushType: 'stroke' | |||
| }, | |||
| label: { | |||
| normal: { | |||
| show: true, | |||
| position: 'right', | |||
| formatter: '{b}' | |||
| } | |||
| }, | |||
| symbolSize: function(val) { | |||
| return val[2] / 8 | |||
| }, | |||
| itemStyle: { | |||
| normal: { | |||
| color: color[i] | |||
| } | |||
| }, | |||
| data: item[1].map(function(dataItem) { | |||
| return { | |||
| name: dataItem[1].name, | |||
| value: geoCoordMap[dataItem[1].name].concat([dataItem[1].value]) | |||
| } | |||
| }) | |||
| } | |||
| ) | |||
| }) | |||
| return { | |||
| animation: false, | |||
| title: { | |||
| text: '模拟迁徙', | |||
| subtext: '数据纯属虚构', | |||
| left: 'center', | |||
| textStyle: { | |||
| color: '#fff' | |||
| } | |||
| }, | |||
| tooltip: { | |||
| trigger: 'item' | |||
| }, | |||
| legend: { | |||
| orient: 'vertical', | |||
| top: 'bottom', | |||
| left: 'right', | |||
| data: ['北京 Top10', '上海 Top10', '广州 Top10'], | |||
| textStyle: { | |||
| color: '#fff' | |||
| }, | |||
| selectedMode: 'single' | |||
| }, | |||
| GLMap: {}, | |||
| series: series | |||
| } | |||
| } | |||
| DC.ready(initViewer) | |||
| </script> | |||
| </body> | |||
| </html> | |||
| </body> | |||
| </html> | |||