Caven Chen
2 年前
+ 4
- 4
examples/animation/track_clamp_to_ground.html
查看文件
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let terrain = DC.TerrainFactory.createUrlTerrain({ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.setTerrain(terrain) | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | ||||
| style:'img', | style:'img', | ||||
| crs:'WGS84' | crs:'WGS84' | ||||
| }) | }) | ||||
| viewer.addBaseLayer( baseLayer) | viewer.addBaseLayer( baseLayer) | ||||
| let terrain = DC.TerrainFactory.createUrlTerrain({ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.addTerrain(terrain) | |||||
| tc = new DC.TrackController(viewer) | tc = new DC.TrackController(viewer) | ||||
| let positions = "119.6690974094955,30.619898051672074;119.80669126724348,30.820857646248754" | let positions = "119.6690974094955,30.619898051672074;119.80669126724348,30.820857646248754" | ||||
| track = new DC.Track(positions,50,()=>{},{ | track = new DC.Track(positions,50,()=>{},{ |
+ 1
- 0
examples/assets/data/wind.json
文件差异内容过多而无法显示
查看文件
+ 0
- 47
examples/baselayer/ter_arcgis.html
查看文件
| <!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.min.js'></script> | |||||
| <script src="../dat.gui.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'> | |||||
| </head> | |||||
| <body> | |||||
| <div id="viewer-container" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> |
+ 0
- 44
examples/baselayer/ter_ch.html
查看文件
| <!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.min.js'></script> | |||||
| <script src="../dat.gui.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'> | |||||
| </head> | |||||
| <body> | |||||
| <div id="viewer-container" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> |
+ 0
- 48
examples/baselayer/ter_exaggeration.html
查看文件
| <!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.min.js'></script> | |||||
| <script src="../dat.gui.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'> | |||||
| </head> | |||||
| <body> | |||||
| <div id="viewer-container" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> |
+ 0
- 431
examples/datav/e_airline.html
查看文件
| <!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" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> | |||||
| </body> | |||||
| </html> |
+ 0
- 321
examples/datav/e_plane.html
查看文件
| <!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" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> | |||||
| </body> | |||||
| </html> |
+ 0
- 1068
examples/datav/e_pm2.5.html
文件差异内容过多而无法显示
查看文件
+ 0
- 529
examples/datav/e_pm2.5_2.html
查看文件
| <!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" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> | |||||
| </body> | |||||
| </html> |
+ 0
- 648
examples/datav/e_qx.html
查看文件
| <!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" class="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({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> | |||||
| </body> | |||||
| </html> |
+ 0
- 254
examples/datav/e_qx_2.html
文件差异内容过多而无法显示
查看文件
+ 0
- 3278
examples/datav/e_rk.html
文件差异内容过多而无法显示
查看文件
+ 0
- 464
examples/datav/e_wl.html
查看文件
| <!DOCTYPE html> | |||||
| <html lang="en"> | |||||
| <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" class="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 chinaGeoCoordMap = { | |||||
| 黑龙江: [127.9688, 45.368], | |||||
| 内蒙古: [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, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '内蒙古', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '吉林', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '辽宁', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '河北', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '天津', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '山西', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '陕西', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '甘肃', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '宁夏', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '青海', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '新疆', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '西藏', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '四川', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '重庆', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '山东', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '河南', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '江苏', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '安徽', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '湖北', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '浙江', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '福建', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '江西', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '湖南', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '贵州', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '广西', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ], | |||||
| [ | |||||
| { | |||||
| name: '海南', | |||||
| value: 0, | |||||
| price: 100, | |||||
| num: 2 | |||||
| } | |||||
| ] | |||||
| ] | |||||
| var convertData = function(data) { | |||||
| var res = [] | |||||
| for (var i = 0; i < data.length; i++) { | |||||
| var dataItem = data[i] | |||||
| // console.log('dataItem',dataItem) //第二个数据 | |||||
| var fromCoord = [116.4551, 40.2539] | |||||
| var toCoord = chinaGeoCoordMap[dataItem[0].name] | |||||
| // console.log('toCoord',toCoord);//第一个地址 | |||||
| if (fromCoord && toCoord) { | |||||
| res.push([ | |||||
| { | |||||
| coord: fromCoord, | |||||
| value: dataItem[0].value | |||||
| }, | |||||
| { | |||||
| coord: toCoord, | |||||
| dataItem: dataItem | |||||
| } | |||||
| ]) | |||||
| } | |||||
| } | |||||
| return res | |||||
| } | |||||
| let redName = '新疆' | |||||
| 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 series = [] | |||||
| ;[['北京市', chinaDatas]].forEach(function(item, i) { | |||||
| series.push( | |||||
| { | |||||
| type: 'lines', | |||||
| coordinateSystem: 'GLMap', | |||||
| zlevel: 2, | |||||
| effect: { | |||||
| show: true, | |||||
| period: 4, //箭头指向速度，值越小速度越快 | |||||
| trailLength: 0.1, //特效尾迹长度[0,1]值越大，尾迹越长重 | |||||
| symbol: 'circle', //箭头图标 | |||||
| symbolSize: 3, //图标大小 | |||||
| color: '#fff' | |||||
| }, | |||||
| lineStyle: { | |||||
| normal: { | |||||
| width: 0.7, //尾迹线条宽度 | |||||
| opacity: 0.5, //尾迹线条透明度 | |||||
| curveness: 0.2, //尾迹线条曲直度 | |||||
| color: function(params) { | |||||
| return '#ffa022' | |||||
| } | |||||
| }, | |||||
| color: 'red' | |||||
| }, | |||||
| data: convertData(item[1]) | |||||
| }, | |||||
| { | |||||
| type: 'effectScatter', | |||||
| coordinateSystem: 'GLMap', | |||||
| zlevel: 2, | |||||
| rippleEffect: { | |||||
| //涟漪特效 | |||||
| period: 4, //动画时间，值越小速度越快 | |||||
| brushType: 'fill', //波纹绘制方式 stroke, fill | |||||
| scale: 2.2 //波纹圆环最大限制，值越大波纹越大 | |||||
| }, | |||||
| // 括 'circle', 'rect', 'roundRect', 'triangle', 'diamond', 'pin', 'arrow', 'none' | |||||
| // symbol: 'none', | |||||
| symbol: 'circle', | |||||
| symbolSize: function(val) { | |||||
| return 5 //圆环大小 | |||||
| }, | |||||
| itemStyle: { | |||||
| normal: { | |||||
| show: false, | |||||
| // color: '#f00' | |||||
| color: function(params) { | |||||
| //圆环显示文字 | |||||
| // console.log('redName',redName) | |||||
| return '#ffa022' | |||||
| }, | |||||
| borderWidth: 0, | |||||
| shadowColor: '#b5e8fa', //发光🉐效果 | |||||
| shadowBlur: 4 | |||||
| } | |||||
| }, | |||||
| tooltip: { | |||||
| // show:false, | |||||
| trigger: 'item', | |||||
| backgroundColor: 'rgba(8, 18, 42, 0.85)', | |||||
| borderColor: '#040616', | |||||
| showDelay: 0, | |||||
| hideDelay: 0, | |||||
| enterable: true, | |||||
| transitionDuration: 0, | |||||
| extraCssText: 'z-index:100', | |||||
| formatter: function(params, ticket, callback) { | |||||
| // 根据业务自己拓展要显示的内容 | |||||
| //console.log('params--2',params) | |||||
| let res = '' | |||||
| let name = params.data.dataItem[0].name | |||||
| let price = params.data.dataItem[0].price | |||||
| let num = params.data.dataItem[0].num | |||||
| res = | |||||
| "<div style='color:#fff;padding:10px;'><span>北京->" + | |||||
| name + | |||||
| '</span><br/><span>均价：' + | |||||
| price + | |||||
| '</span><br/><span>线路数：' + | |||||
| num + | |||||
| '</span></div>' | |||||
| return res | |||||
| } | |||||
| }, | |||||
| data: item[1].map(function(dataItem) { | |||||
| // console.log('dataItem',dataItem[0]); | |||||
| return { | |||||
| dataItem: dataItem, | |||||
| name: dataItem[0].name, | |||||
| value: chinaGeoCoordMap[dataItem[0].name].concat([ | |||||
| dataItem[0].value | |||||
| ]) | |||||
| } | |||||
| }) | |||||
| }, | |||||
| //被攻击点 | |||||
| { | |||||
| type: 'scatter', | |||||
| coordinateSystem: 'geo', | |||||
| zlevel: 1, | |||||
| rippleEffect: { | |||||
| period: 4, | |||||
| brushType: 'stroke', | |||||
| scale: 4 | |||||
| }, | |||||
| symbol: 'circle', | |||||
| color: 'rgba(128, 220, 251, .6)', | |||||
| symbolSize: 20, | |||||
| data: [ | |||||
| { | |||||
| name: item[0], | |||||
| value: chinaGeoCoordMap[item[0]].concat([10]) | |||||
| } | |||||
| ] | |||||
| } | |||||
| ) | |||||
| }) | |||||
| return { | |||||
| animation: false, | |||||
| GLMap: {}, | |||||
| series: series | |||||
| } | |||||
| } | |||||
| DC.ready({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | |||||
| }).then(initViewer) | |||||
| </script> | |||||
| </body> | |||||
| </html> |
+ 13
- 10
examples/datav/heat.html
查看文件
| for (let i = 0; i < num; i++) { | for (let i = 0; i < num; i++) { | ||||
| let lng = 120.38105869 + Math.random() * 0.5 | let lng = 120.38105869 + Math.random() * 0.5 | ||||
| let lat = 31.10115627 + Math.random() * 0.5 | let lat = 31.10115627 + Math.random() * 0.5 | ||||
| list.push(new DC.Position(lng, lat)) | |||||
| list.push({lng,lat}) | |||||
| } | } | ||||
| return list | return list | ||||
| } | } | ||||
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let baseLayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||||
| baseLayer.defaultBrightness= 0.2 | |||||
| viewer.addBaseLayer( baseLayer) | |||||
| setTimeout(()=>{ | |||||
| let layer = new DC.HeatLayer('layer') | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||||
| crs:'WGS84' | |||||
| }) | |||||
| viewer.addBaseLayer( baseLayer,{ | |||||
| brightness : 0.1 | |||||
| }) | |||||
| viewer.flyToPosition("120.670183527,31.348282115,109658.22,0,-90",()=>{ | |||||
| let layer = new DC.HeatMapLayer('layer') | |||||
| layer.setPoints(generatePosition(1000)) | |||||
| viewer.addLayer(layer) | viewer.addLayer(layer) | ||||
| let positions = generatePosition(1000) | |||||
| layer.setPositions(positions) | |||||
| }) | }) | ||||
| viewer.flyToPosition("120.670183527,31.348282115,109658.22,0,-89.90659095062371") | |||||
| } | } | ||||
| DC.ready({ | |||||
| DC.ready({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | baseUrl:'../libs/dc-sdk/resources/' | ||||
| }).then(initViewer) | }).then(initViewer) | ||||
| </script> | </script> |
+ 11
- 12
examples/datav/heat_building.html
查看文件
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | <meta name="viewport" content="width=device-width,initial-scale=1.0"> | ||||
| <title>dc-example</title> | <title>dc-example</title> | ||||
| <script src='/libs/dc-sdk/dc.min.js'></script> | <script src='/libs/dc-sdk/dc.min.js'></script> | ||||
| <script src="../dat.gui.min.js"></script> | |||||
| <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | ||||
| <link href='../index.css' type='text/css' rel='stylesheet'> | <link href='../index.css' type='text/css' rel='stylesheet'> | ||||
| </head> | </head> | ||||
| for (let i = 0; i < num; i++) { | for (let i = 0; i < num; i++) { | ||||
| let lng = 121.48339987478337 + Math.random() * 0.05 | let lng = 121.48339987478337 + Math.random() * 0.05 | ||||
| let lat = 31.220954026657488 + Math.random() * 0.05 | let lat = 31.220954026657488 + Math.random() * 0.05 | ||||
| list.push(new DC.Position(lng, lat)) | |||||
| list.push({lng,lat}) | |||||
| } | } | ||||
| return list | return list | ||||
| } | } | ||||
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let baseLayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||||
| baseLayer.defaultBrightness= 0.2 | |||||
| viewer.addBaseLayer( baseLayer) | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||||
| crs:'WGS84' | |||||
| }) | |||||
| viewer.addBaseLayer( baseLayer,{ | |||||
| brightness : 0.1 | |||||
| }) | |||||
| let buildingLayer = new DC.TilesetLayer('building-layer').addTo(viewer) | let buildingLayer = new DC.TilesetLayer('building-layer').addTo(viewer) | ||||
| let tileset = new DC.Tileset( | let tileset = new DC.Tileset( | ||||
| '//resource.dvgis.cn/data/3dtiles/ljz/tileset.json' | '//resource.dvgis.cn/data/3dtiles/ljz/tileset.json' | ||||
| ) | ) | ||||
| buildingLayer.addOverlay(tileset) | buildingLayer.addOverlay(tileset) | ||||
| setTimeout(()=>{ | |||||
| let layer = new DC.HeatLayer('layer',{ | |||||
| viewer.flyToPosition("121.45765915248303,31.202070402003816,2301.94,44.95,-23.06",()=>{ | |||||
| let layer = new DC.HeatMapLayer('layer',{ | |||||
| useGround: true | useGround: true | ||||
| }) | }) | ||||
| layer.setPoints(generatePosition(10000)) | |||||
| viewer.addLayer(layer) | viewer.addLayer(layer) | ||||
| layer.setPositions(generatePosition(10000)) | |||||
| }) | }) | ||||
| viewer.flyToPosition("121.45765915248303,31.202070402003816,2301.94,44.95,-23.06") | |||||
| } | } | ||||
| DC.ready({ | |||||
| DC.ready({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | baseUrl:'../libs/dc-sdk/resources/' | ||||
| }).then(initViewer) | }).then(initViewer) | ||||
| </script> | </script> |
+ 15
- 14
examples/datav/heat_height.html
查看文件
| <meta name="viewport" content="width=device-width,initial-scale=1.0"> | <meta name="viewport" content="width=device-width,initial-scale=1.0"> | ||||
| <title>dc-example</title> | <title>dc-example</title> | ||||
| <script src='/libs/dc-sdk/dc.min.js'></script> | <script src='/libs/dc-sdk/dc.min.js'></script> | ||||
| <script src="../dat.gui.min.js"></script> | |||||
| <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | <link href='/libs/dc-sdk/dc.min.css' type='text/css' rel='stylesheet'> | ||||
| <link href='../index.css' type='text/css' rel='stylesheet'> | <link href='../index.css' type='text/css' rel='stylesheet'> | ||||
| </head> | </head> | ||||
| function generatePosition(num) { | function generatePosition(num) { | ||||
| let list = [] | let list = [] | ||||
| for (let i = 0; i < num; i++) { | for (let i = 0; i < num; i++) { | ||||
| let lng = 120.38105869 + Math.random() * 0.5 | |||||
| let lat = 31.10115627 + Math.random() * 0.5 | |||||
| list.push(new DC.Position(lng, lat)) | |||||
| let lng = 120.38105869 + Math.random() * 0.05 | |||||
| let lat = 31.10115627 + Math.random() * 0.05 | |||||
| list.push({lng,lat}) | |||||
| } | } | ||||
| return list | return list | ||||
| } | } | ||||
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let baseLayer = DC.ImageryLayerFactory.createAmapImageryLayer() | |||||
| baseLayer.defaultBrightness= 0.2 | |||||
| viewer.addBaseLayer( baseLayer) | |||||
| setTimeout(()=>{ | |||||
| let layer = new DC.HeatLayer('layer',{}) | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||||
| crs:'WGS84' | |||||
| }) | |||||
| viewer.addBaseLayer( baseLayer,{ | |||||
| brightness : 0.1 | |||||
| }) | |||||
| viewer.flyToPosition("120.58464690,30.57441821,35840.6299288431,5.80,-27.24",()=>{ | |||||
| let layer = new DC.HeatMapLayer('layer',{}) | |||||
| layer.setPoints(generatePosition(10000)) | |||||
| viewer.addLayer(layer) | viewer.addLayer(layer) | ||||
| layer.setPositions(generatePosition(10000)) | |||||
| let layer2 = new DC.HeatLayer('layer2',{ height:4000 }) | |||||
| let layer2 = new DC.HeatMapLayer('layer2',{ height:4000 }) | |||||
| layer2.setPoints( generatePosition(10000)) | |||||
| viewer.addLayer(layer2) | viewer.addLayer(layer2) | ||||
| layer2.setPositions( generatePosition(10000)) | |||||
| }) | }) | ||||
| viewer.flyToPosition("120.58464690,30.57441821,35840.6299288431,5.80,-27.24") | |||||
| } | } | ||||
| DC.ready({ | |||||
| DC.ready({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | baseUrl:'../libs/dc-sdk/resources/' | ||||
| }).then(initViewer) | }).then(initViewer) | ||||
| </script> | </script> |
+ 33
- 31
examples/datav/wind.html
查看文件
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let baseLayer = DC.ImageryLayerFactory.createAmapImageryLayer({ | |||||
| style: 'img' | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | |||||
| crs:'WGS84', | |||||
| style:'img' | |||||
| }) | }) | ||||
| viewer.addBaseLayer( baseLayer) | viewer.addBaseLayer( baseLayer) | ||||
| axios.get('./examples/data/wind.json').then(res=>{ | |||||
| windLayer = new DC.WindLayer('wind',{ | |||||
| colorScale: [ | |||||
| 'rgb(36,104, 180)', | |||||
| 'rgb(60,157, 194)', | |||||
| 'rgb(128,205,193 )', | |||||
| 'rgb(151,218,168 )', | |||||
| 'rgb(198,231,181)', | |||||
| 'rgb(238,247,217)', | |||||
| 'rgb(255,238,159)', | |||||
| 'rgb(252,217,125)', | |||||
| 'rgb(255,182,100)', | |||||
| 'rgb(252,150,75)', | |||||
| 'rgb(250,112,52)', | |||||
| 'rgb(245,64,32)', | |||||
| 'rgb(237,45,28)', | |||||
| 'rgb(220,24,32)', | |||||
| 'rgb(180,0,35)' | |||||
| ], | |||||
| frameRate: 16, | |||||
| maxAge: 60, | |||||
| globalAlpha: 0.9, | |||||
| velocityScale: 1 / 30, | |||||
| paths: 2000 | |||||
| fetch('../assets/data/wind.json').then(res=>{ | |||||
| res.json().then(data => { | |||||
| windLayer = new DC.WindLayer('wind',{ | |||||
| colorScale: [ | |||||
| 'rgb(36,104, 180)', | |||||
| 'rgb(60,157, 194)', | |||||
| 'rgb(128,205,193 )', | |||||
| 'rgb(151,218,168 )', | |||||
| 'rgb(198,231,181)', | |||||
| 'rgb(238,247,217)', | |||||
| 'rgb(255,238,159)', | |||||
| 'rgb(252,217,125)', | |||||
| 'rgb(255,182,100)', | |||||
| 'rgb(252,150,75)', | |||||
| 'rgb(250,112,52)', | |||||
| 'rgb(245,64,32)', | |||||
| 'rgb(237,45,28)', | |||||
| 'rgb(220,24,32)', | |||||
| 'rgb(180,0,35)' | |||||
| ], | |||||
| frameRate: 16, | |||||
| maxAge: 60, | |||||
| globalAlpha: 0.9, | |||||
| velocityScale: 1 / 30, | |||||
| paths: 2000 | |||||
| }) | |||||
| windLayer.setData(data) | |||||
| viewer.addLayer(windLayer) | |||||
| addGuiController() // add controller | |||||
| }) | }) | ||||
| windLayer.setData(res.data) | |||||
| viewer.addLayer(windLayer) | |||||
| addGuiController() // add controller | |||||
| }) | }) | ||||
| } | } | ||||
| function addGuiController(){ | function addGuiController(){ | ||||
| let controls = { | let controls = { | ||||
| } | } | ||||
| DC.ready({ | |||||
| DC.ready({ | |||||
| baseUrl:'../libs/dc-sdk/resources/' | baseUrl:'../libs/dc-sdk/resources/' | ||||
| }).then(initViewer) | }).then(initViewer) | ||||
| </script> | </script> |
+ 18
- 1
examples/list.js
查看文件
| { | { | ||||
| name: '数据可视化', | name: '数据可视化', | ||||
| folder: 'datav', | folder: 'datav', | ||||
| children: [], | |||||
| children: [ | |||||
| { | |||||
| name: '热区图', | |||||
| page: 'heat.html', | |||||
| }, | |||||
| { | |||||
| name: '热区图(高度)', | |||||
| page: 'heat_height.html', | |||||
| }, | |||||
| { | |||||
| name: '热区图(建筑)', | |||||
| page: 'heat_building.html', | |||||
| }, | |||||
| { | |||||
| name: '风场', | |||||
| page: 'wind.html', | |||||
| }, | |||||
| ], | |||||
| }, | }, | ||||
| { | { | ||||
| name: 'Echarts', | name: 'Echarts', |
+ 4
- 4
examples/terrain/ter_ch.html
查看文件
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let terrain = DC.TerrainFactory.createTerrain(DC.TerrainType.XYZ,{ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.setTerrain(terrain) | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | ||||
| style:'img', | style:'img', | ||||
| crs:'WGS84' | crs:'WGS84' | ||||
| }) | }) | ||||
| viewer.addBaseLayer(baseLayer) | viewer.addBaseLayer(baseLayer) | ||||
| let terrain = DC.TerrainFactory.createTerrain(DC.TerrainType.XYZ,{ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.addTerrain(terrain) | |||||
| viewer.flyToPosition( | viewer.flyToPosition( | ||||
| new DC.Position( | new DC.Position( | ||||
| 96.70456483909693, | 96.70456483909693, |
+ 4
- 4
examples/terrain/ter_exaggeration.html
查看文件
| function initViewer() { | function initViewer() { | ||||
| viewer = new DC.Viewer('viewer-container') | viewer = new DC.Viewer('viewer-container') | ||||
| let terrain = DC.TerrainFactory.createTerrain(DC.TerrainType.XYZ,{ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.setTerrain(terrain) | |||||
| let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ | ||||
| style:'img', | style:'img', | ||||
| crs:'WGS84' | crs:'WGS84' | ||||
| }) | }) | ||||
| viewer.addBaseLayer(baseLayer) | viewer.addBaseLayer(baseLayer) | ||||
| let terrain = DC.TerrainFactory.createTerrain(DC.TerrainType.XYZ,{ | |||||
| url: 'http://data.marsgis.cn/terrain' | |||||
| }) | |||||
| viewer.addTerrain(terrain) | |||||
| viewer.flyToPosition( | viewer.flyToPosition( | ||||
| new DC.Position( | new DC.Position( | ||||
| 96.70456483909693, | 96.70456483909693, |
+ 3
- 0
src/modules/index.js
查看文件
| VectorLayer, | VectorLayer, | ||||
| } from './layer' | } from './layer' | ||||
| export { default as HeatMapLayer } from './heat-map/HeatMapLayer' | |||||
| export { default as WindLayer } from './wind/WindLayer' | |||||
| export { | export { | ||||
| Overlay, | Overlay, | ||||
| OverlayType, | OverlayType, |
正在加载...