| @@ -0,0 +1,22 @@ | |||
| import { defineConfig } from 'vitepress' | |||
| import zhConfig from './locales/zh.config.js' | |||
| import enConfig from './locales/en.config.js' | |||
| export default defineConfig({ | |||
| base: '/docs/', | |||
| cleanUrls: 'without-subfolders', | |||
| head: [['link', { rel: 'icon', href: '/assets/favicon.png' }]], | |||
| locales: { | |||
| root: zhConfig, | |||
| // en: enConfig, | |||
| }, | |||
| themeConfig: { | |||
| logo: '/assets/favicon.png', | |||
| search: { | |||
| provider: 'local', | |||
| }, | |||
| socialLinks: [{ icon: 'github', link: 'https://github.com/dvgis/dc-sdk' }], | |||
| footer: { | |||
| copyright: '版权所有 © 2019 - 2023 数字视觉(Digital Visual)', | |||
| }, | |||
| }, | |||
| }) | |||
| @@ -0,0 +1,6 @@ | |||
| export default { | |||
| label: 'English', | |||
| lang: 'en', | |||
| link: '/en/', | |||
| title: 'DC-SDK Docs', | |||
| } | |||
| @@ -0,0 +1,20 @@ | |||
| --- | |||
| layout: home | |||
| hero: | |||
| name: DC-SDK | |||
| text: Make <code>WebGis</code> development easier | |||
| image: | |||
| src: /assets/doc.gif | |||
| alt: VitePress | |||
| actions: | |||
| - theme: brand | |||
| text: Quick Start | |||
| link: /zh/guide/introduction | |||
| features: | |||
| - title: Simpler | |||
| details: Build a 3D WebGis application with just a div and a few lines of code! | |||
| - title: Easy-use | |||
| details: Using standard development classes, a simple new operation can be used to get the scene elements | |||
| - title: Expandable | |||
| details: Supports custom cesium and gis algorithm libraries; provides base classes and element lifecycle hooks | |||
| --- | |||
 
							 
							| @@ -0,0 +1,536 @@ | |||
| # 效果动画 🌎 | |||
| ## Animation | |||
| > 场景动画基类 | |||
| :::warning | |||
| 该类无法实例化 | |||
| ::: | |||
| ### methods | |||
| - **_start()_** | |||
| 开始动画 | |||
| - 返回值 `this` | |||
| - **_stop()_** | |||
| 停止动画 | |||
| - 返回值 `this` | |||
| ## DC.AroundPoint | |||
| > 点位环绕,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let aroundPoint = new DC.AroundPoint(viewer, '120.121, 31.12') | |||
| aroundPoint.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,position,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - `{Position|String|Array} position`:点位 | |||
| - `{Object} options`:options | |||
| - 返回值 `aroundPoint` | |||
| ```json | |||
| //options(optional) | |||
| { | |||
| "heading": 0, //偏移角度 | |||
| "pitch": 0, //翻转角度 | |||
| "range": 0, //距离 | |||
| "duration": 0, //间隔,单位:秒,当此值大于0时,callback才会生效 | |||
| "callback": null, //完成回调函数 | |||
| "context": null //回调函数执行上下文 | |||
| } | |||
| ``` | |||
| ## DC.AroundView | |||
| > 相机环绕,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let aroundView = new DC.AroundView(viewer) | |||
| aroundView.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - `{Object} options`:options | |||
| - 返回值 `aroundView` | |||
| ```json | |||
| //options(optional) | |||
| { | |||
| "heading": 0, //偏移角度 | |||
| "pitch": 0, //俯仰角度 | |||
| "roll": 0, //翻转角度 | |||
| "duration": 0, //间隔,单位:秒,当此值大于0时,callback才会生效 | |||
| "callback": null, //完成回调函数 | |||
| "context": null //回调函数执行上下文 | |||
| } | |||
| ``` | |||
| ## DC.Flying | |||
| > 定点巡航,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let flying = new DC.Flying(viewer) | |||
| flying.positions = ['121.234,21.212,0,-29', '121.435,21.212,0,-29'] | |||
| flying.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:场景 | |||
| - `{Object} options`:options | |||
| - 返回值 `flying` | |||
| ```json | |||
| // 属性参数(optional) | |||
| { | |||
| "loop": false, //是否循环, | |||
| "dwellTime": 3, //驻留时间 | |||
| "callback": null //回调函数 | |||
| } | |||
| ``` | |||
| ### properties | |||
| - `{Array} positions`:点位 | |||
| - `{Array} durations`:每个点位的飞行间隔时间,当数组长度为 1 时,每个间隔时间相同,如果不为 1 时,长度必须和点位长度相等 | |||
| ### methods | |||
| - **_start()_** | |||
| 开始动画 | |||
| - 返回值 `this` | |||
| - **_pause()_** | |||
| 暂停 | |||
| - 返回值 `this` | |||
| - **_restore()_** | |||
| 继续 | |||
| - 返回值 `this` | |||
| ## DC.GlobeRotate | |||
| > 地球自转,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let globeRotate = new DC.GlobeRotate(viewer, { | |||
| duration: 5, | |||
| speed: 1000, | |||
| callback: () => {}, | |||
| }) | |||
| globeRotate.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{DC.Viewer} viewer`:3D 场景 | |||
| - `{Object} options`:options | |||
| - 返回值 `globeRotate` | |||
| ```json | |||
| //options(optional) | |||
| { | |||
| "speed": 12 * 1000, //速度 | |||
| "duration": 0, //持续时间,当此值大于0时,callback才会生效 | |||
| "callback": null, //执行完成的回调函数 | |||
| "context": null //回调函数执行上下文 | |||
| } | |||
| ``` | |||
| ## DC.RoamingController | |||
| > 漫游控制 | |||
| ### example | |||
| ```js | |||
| let rc = new DC.RoamingController(viewer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - 返回值 `roamingController` | |||
| ### methods | |||
| - **_addPath(path)_** | |||
| 添加路径 | |||
| - 参数 | |||
| - `{RoamingPath} path`:路径 | |||
| - 返回值 `this` | |||
| - **_addPaths(paths)_** | |||
| 添加路径数组 | |||
| - 参数 | |||
| - `{Array<RoamingPath>} paths`:路径数组 | |||
| - 返回值 `this` | |||
| - **_removePath(path)_** | |||
| 移除路径 | |||
| - 参数 | |||
| - `{RoamingPath} path`:路径 | |||
| - 返回值 `path` | |||
| - **_getPath(id)_** | |||
| 根据唯一标识获取路径 | |||
| - 参数 | |||
| - `{String} id`:唯一标识 | |||
| - 返回值 `path` | |||
| - **_getPaths()_** | |||
| 获取所有路径 | |||
| - 返回值 `array` | |||
| - **_activate(path, viewOption)_** | |||
| 激活漫游 | |||
| - 参数 | |||
| - `{RoamingPath} path`:路径 | |||
| - `{String} viewOption`:漫游参数 | |||
| - 返回值 `this` | |||
| ```json | |||
| // 漫游参数(可选) | |||
| { | |||
| "pitch": 0, // 俯仰角 | |||
| "range": 1000 // 距离 | |||
| } | |||
| ``` | |||
| - **_deactivate()_** | |||
| 结束漫游 | |||
| - 返回值 `this` | |||
| - **_clear()_** | |||
| 移除所有路径 | |||
| - 返回值 `this` | |||
| ## DC.RoamingPath | |||
| > 漫游路径 | |||
| ### example | |||
| ```js | |||
| let path = new DC.RoamingPath('120.121,32.1213;121.132,32.1213', 20) | |||
| rc.addPath(path) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(positions, duration, [pathMode])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String|Array<Position|Number|String|Object>} positions`:坐标串 | |||
| - `{Number} duration`:间隔时间,单位:秒 | |||
| - `{String} pathMode`:路径模式:speed(匀速) / time(等时) | |||
| - 返回值 `roamingPath` | |||
| ### properties | |||
| - `{String} pathId`:唯一标识 **_`readonly`_** | |||
| - `{String} id`:业务唯一标识 | |||
| - `{String|Array<Position|Number|String>} positions`:坐标串 | |||
| - `{Number} duration`:间隔时间,单位:秒 | |||
| - `{String} pathMode`:路径模式:speed(匀速) / time(等时) | |||
| - `{String} state`:状态 **_`readonly`_** | |||
| ## DC.KeyboardRoaming | |||
| > 键盘漫游 | |||
| ### example | |||
| ```js | |||
| let kr = new DC.KeyboardRoaming(viewer) | |||
| kr.enable = true | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - 返回值 `keyboardRoaming` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} moveRate`:移动变化率:100 | |||
| - `{Number} rotateRate`:旋转变化率:0.01 | |||
| ## DC.TrackController | |||
| > 历史轨迹控制 | |||
| ### example | |||
| ```js | |||
| let tc = new DC.TrackController(viewer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - 返回值 `trackController` | |||
| ### methods | |||
| - **_addTrack(track)_** | |||
| 添加轨迹 | |||
| - 参数 | |||
| - `{Track} track`:轨迹 | |||
| - 返回值 `this` | |||
| - **_addTracks(tracks)_** | |||
| 添加轨迹数组 | |||
| - 参数 | |||
| - `{Array<Track>} tracks`:轨迹数组 | |||
| - 返回值 `this` | |||
| - **_removeTrack(track)_** | |||
| 移除轨迹 | |||
| - 参数 | |||
| - `{Track} track`:轨迹 | |||
| - 返回值 `path` | |||
| - **_getTrack(id)_** | |||
| 根据业务唯一标识获取轨迹 | |||
| - 参数 | |||
| - `{String} id`:业务唯一标识 | |||
| - 返回值 `track` | |||
| - **_getTracks()_** | |||
| 获取所有轨迹 | |||
| - 返回值 `array` | |||
| - **_play()_** | |||
| 播放 | |||
| - 返回值 `this` | |||
| - **_pause()_** | |||
| 暂停 | |||
| - 返回值 `this` | |||
| - **_restore()_** | |||
| 继续播放 | |||
| - 返回值 `this` | |||
| - **_viewTrack(track, viewOption)_** | |||
| 跟踪某一条路径 | |||
| - 参数 | |||
| - `{Track} track`:路径 | |||
| - `{String} viewOption`:配置信息 | |||
| - 返回值 `this` | |||
| ```json | |||
| // 属性参数(可选) | |||
| { | |||
| "mode": null, // 视角模式:DC.TrackViewMode | |||
| "pitch": 0, // 俯仰角,第一视角有效 | |||
| "range": 1000 // 距离 | |||
| } | |||
| ``` | |||
| - **_releaseTrack(track)_** | |||
| 取消跟踪某一条轨迹 | |||
| - 参数 | |||
| - `{Track} track`:路径 | |||
| - 返回值 `this` | |||
| - **_clear()_** | |||
| 移除所有路径 | |||
| - 返回值 `this` | |||
| ## DC.Track | |||
| > 轨迹 | |||
| ### example | |||
| ```js | |||
| let tc = new DC.TrackController(viewer) | |||
| let track = new DC.Track('120.121,32.1213;121.132,32.1213', 20) | |||
| tc.addTrack(track) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(positions, duration, [callback], [options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String|Array<Position|Number|String|Object>} positions`:坐标串 | |||
| - `{Number} duration`:间隔时间,单位:秒 | |||
| - `{Function} callback`:每一个点位到达回调函数,参数有:position(位置信息),isLast(是否为最后的点位) | |||
| - `{Object} options`: 配置参数 | |||
| - 返回值 `track` | |||
| ```json | |||
| //配置参数(可选) | |||
| { | |||
| "clampToGround": false, // 是否贴地 | |||
| "clampToTileset": false, // 是否贴物 | |||
| "interpolationType": "Linear", // 插值类型:Linear、Hermite、Lagrange | |||
| "interpolationDegree": 2, // 插值度数 | |||
| "endDelayTime": 0.5,// 结束时间延长时间,单位:秒, | |||
| "headingOffset":0,//旋转偏移 | |||
| } | |||
| ``` | |||
| ### properties | |||
| - `{String} trackId`:唯一标识 **_`readonly`_** | |||
| - `{String} id`:业务唯一标识 | |||
| - `{String|Array<Position|Number|String|Object>} positions`:坐标串 | |||
| - `{Number} duration`:间隔时间,单位:秒 | |||
| - `{Date} startTime`:开始时间,设置后会独立于控制器的开始时间 | |||
| - `{String} state`:状态 **_`readonly`_** | |||
| ### methods | |||
| - **_addPosition(position,duration)_** | |||
| 添加点位 | |||
| - 参数 | |||
| - `{Position|Array|String|Object} position`:点位 | |||
| - `{Number} duration`:间隔,单位:秒 | |||
| - 返回值 `this` | |||
| - **_setModel(modelUrl,style)_** | |||
| 设置模型 | |||
| - 参数 | |||
| - `{String} modelPath`:模型路径 | |||
| - `{Object} style`:样式,详情参考:[DC.Model](../overlay/#dc-model) | |||
| - 返回值 `this` | |||
| - **_setBillboard(icon,style)_** | |||
| 设置图标 | |||
| - 参数 | |||
| - `{String} icon`:图标路径 | |||
| - `{Object} style`:样式,参考:[DC.Billboard](../overlay/#dc-billboard) | |||
| - 返回值 `this` | |||
| - **_setLabel(text,style)_** | |||
| 设置文本 | |||
| - 参数 | |||
| - `{String} text`:文本 | |||
| - `{Object} style`:样式,参考:[DC.Label](../overlay/#dc-label) | |||
| - 返回值 `this` | |||
| - **_setPath(visible,style)_** | |||
| 设置路径 | |||
| - 参数 | |||
| - `{Boolean}} visible`:是否可见 | |||
| - `{Object} style`:样式,参考:[DC.Polyline](../overlay/#dc-polyline) | |||
| - 返回值 `this` | |||
| @@ -0,0 +1,313 @@ | |||
| # 场景效果 🌎 | |||
| ## DC.Weather | |||
| > 天气效果 | |||
| ### example | |||
| ```js | |||
| let weather = new DC.Weather(viewer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - 返回值 `weather` | |||
| ### properties | |||
| - [`{Rain} rain`](#rain):雨天 **_`readonly`_** | |||
| - [`{Snow} snow`](#snow):雪天 **_`readonly`_** | |||
| - [`{Fog} snow`](#fog):雾天 **_`readonly`_** | |||
| - [`{Cloud} cloud`](#cloud):云 **_`readonly`_** | |||
| ## Rain | |||
| > 雨天效果 | |||
| ### example | |||
| ```js | |||
| weather.rain.enable = true | |||
| weather.rain.speed = 2 | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} speed`:速度 | |||
| ## Snow | |||
| > 雪天效果 | |||
| ### example | |||
| ```js | |||
| weather.snow.enable = true | |||
| weather.snow.speed = 2 | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} speed`:速度 | |||
| ## Fog | |||
| > 雾天效果 | |||
| ### example | |||
| ```js | |||
| weather.fog.enable = true | |||
| weather.fog.fogColor = DC.Color.BLACK | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Color} fogColor`:颜色, | |||
| - `{Object} fogByDistance`:距离可见,默认: `{ near: 10, nearValue: 0, far: 2000, farValue: 1.0 }` | |||
| ## Cloud | |||
| > 云效果 | |||
| ### example | |||
| ```js | |||
| weather.cloud.enable = true | |||
| weather.cloud.rotateAmount = 0.02 | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} rotateAmount`:移动增量,可为负数 | |||
| ## DC.Effect | |||
| > 效果类 | |||
| ### example | |||
| ```js | |||
| let effect = new DC.Effect(viewer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:3D 场景 | |||
| - 返回值 `effect` | |||
| ### properties | |||
| - [`{BlackAndWhite} blackAndWhite`](#blackandwhite):黑白 **_`readonly`_** | |||
| - [`{Bloom} bloom`](#bloom):泛光 **_`readonly`_** | |||
| - [`{Brightness} brightness`](#brightness):明亮 **_`readonly`_** | |||
| - [`{DepthOfField} depthOfField`](#depthoffield):景深 **_`readonly`_** | |||
| - [`{LensFlare} lensFlare`](#lensflare):镜头耀斑 **_`readonly`_** | |||
| - [`{Night} night`](#night):夜视 **_`readonly`_** | |||
| - [`{Silhouette} silhouette`](#silhouette):描边 **_`readonly`_** | |||
| ## BlackAndWhite | |||
| > 黑白效果 | |||
| ### example | |||
| ```js | |||
| effect.blackAndWhite.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} gradations`:强度 | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## Bloom | |||
| > 泛光效果 | |||
| ### example | |||
| ```js | |||
| effect.bloom.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} contrast`:对比度 | |||
| - `{Number} brightness`:亮度 | |||
| - `{Number} glowOnly`:只发光 | |||
| - `{Number} delta`:Delta | |||
| - `{Number} sigma`:Sigma | |||
| - `{Number} stepSize`:StepSize | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## Brightness | |||
| > 明亮效果 | |||
| ### example | |||
| ```js | |||
| effect.brightness.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number} intensity`:强度 | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## DepthOfField | |||
| > 景深效果 | |||
| ### example | |||
| ```js | |||
| effect.depthOfField.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number}} focalDistance`:焦距 | |||
| - `{Number} delta`:Delta | |||
| - `{Number} sigma`:Sigma | |||
| - `{Number} stepSize`:StepSize | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## LensFlare | |||
| > 镜头耀斑效果 | |||
| ### example | |||
| ```js | |||
| effect.lensFlare.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Number}} intensity`:强度 | |||
| - `{Number} distortion`:扭曲度 | |||
| - `{Number} dirtAmount`:分散度 | |||
| - `{Number} haloWidth`:光圈宽度 | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## Night | |||
| > 夜视效果 | |||
| ### example | |||
| ```js | |||
| effect.night.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## Silhouette | |||
| > 描边效果 | |||
| ### example | |||
| ```js | |||
| effect.silhouette.enable = true | |||
| ``` | |||
| ### properties | |||
| - `{Boolean} enable`:是否启用 | |||
| - `{Color} color`:颜色 | |||
| - `{Number} length`:长度 | |||
| - `{Array} selected`:设置后期作用的覆盖物 | |||
| ## DC.CircleScan | |||
| > 扫描圈,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let circleScan = new DC.CircleScan(viewer, '120, 20', 200) | |||
| circleScan.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,position,radius,options)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:场景 | |||
| - `{DC.Position} position`:位置 | |||
| - `{Number} radius`:半径 | |||
| - `{Object} options`:属性 | |||
| - 返回值 `circleScan` | |||
| ```json | |||
| // 属性参数(optional) | |||
| { | |||
| "color": DC.Color.BLUE, // 颜色 | |||
| "speed": 5 // 速度 | |||
| } | |||
| ``` | |||
| ## DC.RadarScan | |||
| > 雷达扫描,继承于[Animation](#animation) | |||
| ### example | |||
| ```js | |||
| let radarScan = new DC.RadarScan(viewer, '120, 20', 200) | |||
| radarScan.start() | |||
| ``` | |||
| ### creation | |||
| - **_constructor(viewer,position,radius,options)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{Viewer} viewer`:场景 | |||
| - `{DC.Position} position`:位置 | |||
| - `{Number} radius`:半径 | |||
| - `{Object} options`:属性 | |||
| - 返回值 `radarScan` | |||
| ```json | |||
| // 属性参数(optional) | |||
| { | |||
| "color": DC.Color.BLUE, // 颜色 | |||
| "speed": 5 // 速度 | |||
| } | |||
| ``` | |||
| @@ -0,0 +1,250 @@ | |||
| # 全局 API 🌎 | |||
| ## ready() | |||
| > 框架主入口函数,使用框架时必须以其开始,否则使用框架 | |||
| ```js | |||
| DC.ready({}).then(()=>{}) | |||
| ``` | |||
| - 参数 | |||
| - `{Object} config`:配置参数 | |||
| - 返回值 `Promise` | |||
| ```json | |||
| //属性参数(可选) | |||
| { | |||
| "Cesium": '<自定义的Cesium库,如果未设置,将使用框架内部默认Cesium框架>', | |||
| "echarts": '<echarts库,设置后将加载echarts图层>', | |||
| "baseUrl": '<Cesium 静态资源路径,默认值为:“./libs/dc-sdk/resources/” >' | |||
| } | |||
| ``` | |||
| ## registerLib() | |||
| > 框架中注册第三放框架包, | |||
| ```js | |||
| DC.registerLib("turf",turf) | |||
| console.log(DC.__namspace.turf) | |||
| ``` | |||
| - 参数 | |||
| - `{String} name`:名称 | |||
| - `{Object} lib`: 库模块 | |||
| ## getLib() | |||
| > 获取框架中注册的第三方框架包, | |||
| ```js | |||
| let turf = DC.getLib("turf") | |||
| ``` | |||
| - 参数 | |||
| - `{String} name`:名称 | |||
| - 返回值 `Object` | |||
| ## 常量 | |||
| > 框架内部默认常量 | |||
| ::: warning | |||
| 开发时请使用默认常量进行开发 | |||
| ::: | |||
| ### MouseEventType | |||
| **_`DC.MouseEventType.LEFT_DOWN`_**: (场景、图层、覆盖物)鼠标左键按下事件 | |||
| **_`DC.MouseEventType.LEFT_UP`_**: (场景、图层、覆盖物)鼠标左键抬升事件 | |||
| **_`DC.MouseEventType.CLICK`_**: (场景、图层、覆盖物)鼠标点击事件 | |||
| **_`DC.MouseEventType.RIGHT_DOWN`_**: (场景、图层、覆盖物)鼠标右键按下事件 | |||
| **_`DC.MouseEventType.RIGHT_UP`_**: (场景、图层、覆盖物)鼠标右键按下事件 | |||
| **_`DC.MouseEventType.RIGHT_CLICK`_**: (场景、图层、覆盖物)鼠标右击事件 | |||
| **_`DC.MouseEventType.DB_CLICK`_**: (场景、图层、覆盖物)鼠标双击事件 | |||
| **_`DC.MouseEventType.MOUSE_MOVE`_**: 场景鼠标移动事件 | |||
| **_`DC.MouseEventType.WHEEL`_**: 场景鼠标滚轮事件 | |||
| **_`DC.MouseEventType.MOUSE_OVER`_**: 覆盖物鼠标移入事件 | |||
| **_`DC.MouseEventType.MOUSE_OUT`_**: 覆盖物鼠标移出事件 | |||
| ### SceneEventType | |||
| **_`DC.SceneEventType.CAMERA_MOVE_END`_**: 相机移动完成 | |||
| **_`DC.SceneEventType.CAMERA_CHANGED`_**: 相机位置完成 | |||
| **_`DC.SceneEventType.PRE_UPDATE`_**: 场景更新前 | |||
| **_`DC.SceneEventType.POST_UPDATE`_**: 场景更新后 | |||
| **_`DC.SceneEventType.PRE_RENDER`_**: 场景渲染前 | |||
| **_`DC.SceneEventType.POST_RENDER`_**: 场景渲染后 | |||
| **_`DC.SceneEventType.MORPH_COMPLETE`_**: 场景模式变换完成 | |||
| **_`DC.SceneEventType.CLOCK_TICK`_**: 时钟跳动 | |||
| **_`DC.SceneEventType.RENDER_ERROR`_**: 渲染错误 | |||
| ### MouseMode | |||
| **_`DC.MouseMode.LEFT_MIDDLE`_**: 左键拖动,中键翻转(默认) | |||
| **_`DC.MouseMode.LEFT_RIGHT`_**: 左键拖动,右键翻转 | |||
| ### ImageryType | |||
| **_`DC.ImageryType.ARCGIS`_**: arcgis 地图 | |||
| **_`DC.ImageryType.SINGLE_TILE`_**: 单图片地图 | |||
| **_`DC.ImageryType.WMS`_**: WMS 地图 | |||
| **_`DC.ImageryType.WMTS`_**: WMTS 地图 | |||
| **_`DC.ImageryType.XYZ`_**: xyz 格式地图 | |||
| **_`DC.ImageryType.COORD`_**: 瓦片坐标地图 | |||
| **_`DC.ImageryType.AMAP`_**: 高德地图 | |||
| **_`DC.ImageryType.BAIDU`_**: 百度地图 | |||
| **_`DC.ImageryType.GOOGLE`_**: 谷歌地图 | |||
| **_`DC.ImageryType.TDT`_**: 天地图 | |||
| **_`DC.ImageryType.TENCENT`_**: 腾讯地图 | |||
| **_`DC.ImageryType.GEO_VIS`_**: 星图地图 | |||
| ### TerrainType | |||
| **_`DC.TerrainType.NONE`_**: 无地形 | |||
| **_`DC.TerrainType.XYZ`_**: xyz 格式地形 | |||
| **_`DC.TerrainType.GOOGLE`_**: 谷歌地形 | |||
| **_`DC.TerrainType.ARCGIS`_**: arcgis 地形 | |||
| **_`DC.TerrainType.VR`_**: VR 地形 | |||
| ### LayerType | |||
| **_`DC.LayerType.VECTOR`_**: 矢量图层 | |||
| **_`DC.LayerType.PRIMITIVE`_**: 图元图层 | |||
| **_`DC.LayerType.TILESET`_**: 3dtiles 图层 | |||
| **_`DC.LayerType.HTML`_**: html 图层 | |||
| **_`DC.LayerType.GEOJSON`_**: GeoJson 图层 | |||
| **_`DC.LayerType.CLUSTER`_**: 聚合图层 | |||
| **_`DC.LayerType.KML`_**: kml 图层 | |||
| **_`DC.LayerType.CZML`_**: czml 图层 | |||
| **_`DC.LayerType.HEAT`_**: 热区图层 | |||
| **_`DC.LayerType.CHART`_**: echarts 图层 | |||
| ### OverlayType | |||
| **_`DC.OverlayType.POINT`_**: 点 **_`可标绘`_** | |||
| **_`DC.OverlayType.POLYLINE`_**: 线 **_`可标绘`_** | |||
| **_`DC.OverlayType.POLYGON`_**: 面 **_`可标绘`_** | |||
| **_`DC.OverlayType.MODEL`_**: 模型 | |||
| **_`DC.OverlayType.BILLBOARD`_**: 图标点 **_`可标绘`_** | |||
| **_`DC.OverlayType.RECTANGLE`_**: 矩形 **_`可标绘`_** | |||
| **_`DC.OverlayType.CIRCLE`_**: 圆 **_`可标绘`_** | |||
| **_`DC.OverlayType.LABEL`_**: 标签 | |||
| **_`DC.OverlayType.TILESET`_**: 3DTiles | |||
| **_`DC.OverlayType.BOX`_**: 盒 | |||
| **_`DC.OverlayType.CORRIDOR`_**: 走廊 | |||
| **_`DC.OverlayType.CYLINDER`_**: 圆柱 | |||
| **_`DC.OverlayType.ELLIPSE`_**: 椭圆 | |||
| **_`DC.OverlayType.ELLIPSOID`_**: 球体 | |||
| **_`DC.OverlayType.PLANE`_**: 面板 | |||
| **_`DC.OverlayType.POLYLINE_VOLUME`_**: 管道 | |||
| **_`DC.OverlayType.WALL`_**: 墙体 | |||
| **_`DC.OverlayType.DYNAMIC_BILLBOARD`_**: 动态图标点 | |||
| **_`DC.OverlayType.DYNAMIC_MODEL`_**: 动态模型点 | |||
| **_`DC.OverlayType.CUSTOM_BILLBOARD`_**: 自定义图标 | |||
| **_`DC.OverlayType.CUSTOM_LABEL`_**: 自定义标签 | |||
| **_`DC.OverlayType.ATTACK_ARROW`_**: 攻击箭头 **_`可标绘`_** | |||
| **_`DC.OverlayType.DOUBLE_ARROW`_**: 双箭头 **_`可标绘`_** | |||
| **_`DC.OverlayType.FINE_ARROW`_**: 直箭头 **_`可标绘`_** | |||
| **_`DC.OverlayType.GATHERING_PLACE`_**: 聚集地 **_`可标绘`_** | |||
| **_`DC.OverlayType.TAILED_ATTACK_ARROW`_**: 燕尾攻击箭头 **_`可标绘`_** | |||
| **_`DC.OverlayType.BILLBOARD_PRIMITIVE`_**: 图标图元 | |||
| **_`DC.OverlayType.DIFFUSE_WALL_PRIMITIVE`_**: 扩散墙图元 | |||
| **_`DC.OverlayType.ELEC_ELLIPSOID_PRIMITIVE`_**: 电弧球图元 | |||
| **_`DC.OverlayType.FLOW_LINE_PRIMITIVE`_**: 流动线图元 | |||
| **_`DC.OverlayType.LABEL_PRIMITIVE`_**: 文本图元 | |||
| **_`DC.OverlayType.MODEL_PRIMITIVE`_**: 模型图元 | |||
| **_`DC.OverlayType.POINT_PRIMITIVE`_**: 点图元 | |||
| **_`DC.OverlayType.POLYLINE_PRIMITIVE`_**: 线图元 | |||
| **_`DC.OverlayType.SCAN_CIRCLE_PRIMITIVE`_**: 扫描圆图元 | |||
| **_`DC.OverlayType.TRAIL_LINE_PRIMITIVE`_**: 轨迹线图元 | |||
| **_`DC.OverlayType.WATER_PRIMITIVE`_**: 水面图元 | |||
| **_`DC.OverlayType.VIDEO_PRIMITIVE`_**: 视频图元 | |||
| ### TrackViewMode | |||
| **_`DC.TrackViewMode.FP`_**: 第一人称视角 | |||
| **_`DC.TrackViewMode.TP`_**: 第三人称视角 | |||
| **_`DC.TrackViewMode.TRACKED`_**: 跟随视角 | |||
| **_`DC.TrackViewMode.FREE`_**: 自由视角 | |||
| @@ -0,0 +1,772 @@ | |||
| # 图层 API 🌎 | |||
| 将具有相同业务逻辑或属性的覆盖元素进行分类,以便于同一管理 | |||
| ## DC.Layer | |||
| > 图层的基类,其子类是实例化后需添加到三维场景中方可展示各类三维数据 | |||
| :::warning | |||
| 该基本类无法实例化,既视实例化后也无法使用 | |||
| ::: | |||
| ### properties | |||
| - `{String} id`:唯一标识 **_`readonly`_** | |||
| - `{Boolean} show`:是否显示 | |||
| - `{Object} attr`:业务属性 | |||
| - `{String} state`:图层状态 **_`readonly`_** | |||
| - `{String} type`:图层类型 **_`readonly`_** | |||
| ### methods | |||
| - **_addOverlay(overlay)_** | |||
| 添加覆盖物 | |||
| - 参数 | |||
| - `{Overlay} overlay`:覆盖物 | |||
| - 返回值 `this` | |||
| - **_addOverlays(overlays)_** | |||
| 添加覆盖物数组 | |||
| - 参数 | |||
| - `{Array<Overlay>} overlays`:覆盖物数组 | |||
| - 返回值 `this` | |||
| - **_removeOverlay(overlay)_** | |||
| 删除覆盖物 | |||
| - 参数 | |||
| - `{Overlay} overlay`:覆盖物 | |||
| - 返回值 `this` | |||
| - **_getOverlay(overlayId)_** | |||
| 根据 Id 获取覆盖物`(不推荐用)` | |||
| - 参数 | |||
| - `{String} overlayId`:覆盖物唯一标识(默认产生) | |||
| - 返回值 `overlay` | |||
| - **_getOverlayById(Id)_** | |||
| 根据业务 Id 获取覆盖物`(推荐用)` | |||
| - 参数 | |||
| - `{String} Id`:覆盖物业务唯一标识 | |||
| - 返回值 `overlay` | |||
| - **_getOverlaysByAttr(attrName, attrVal)_** | |||
| 根据覆盖物属性获取覆盖物 | |||
| - 参数 | |||
| - `{String} attrName`:属性名称 | |||
| - `{Object} attrVal`:属性值 | |||
| - 返回值 `array` | |||
| ```js | |||
| overlay.attr.name = 'test' //设置覆盖物的属性 | |||
| let arr = layer.getOverlaysByAttr('name', 'test') //根据属性获取覆盖物 | |||
| ``` | |||
| - **_getOverlays()_** | |||
| 获取所有覆盖物 | |||
| - 返回值 `array` | |||
| - **_eachOverlay(method, context)_** | |||
| 遍历覆盖物 | |||
| - 参数 | |||
| - `{Function} method`:回调函数,参数为每一个覆盖物 | |||
| - `{Object} context`:上下文 | |||
| - 返回值 `this` | |||
| ```js | |||
| layer.eachOverlay((item) => {}) | |||
| ``` | |||
| - **_clear()_** | |||
| 清空图层 | |||
| - 返回值 `this` | |||
| - **_remove()_** | |||
| 删除图层 | |||
| - 返回值 `this` | |||
| - **_addTo(viewer)_** | |||
| 添加图层到场景 | |||
| - 参数 | |||
| - `{Viewer|World} viewer`:场景 | |||
| - 返回值 `this` | |||
| - **_on(type, callback, context)_** | |||
| 事件订阅 | |||
| - 参数 | |||
| - `{Object} type` :订阅类型 | |||
| - `{Function} callback` :订阅回调 | |||
| - `{Object} context` :上下文 | |||
| - 返回值 `this` | |||
| - **_off(type, callback, context)_** | |||
| 取消事件订阅 | |||
| - 参数 | |||
| - `{Object} type` :订阅类型 | |||
| - `{Function} callback` :订阅回调 | |||
| - `{Object} context` :上下文 | |||
| - 返回值 `this` | |||
| - **_fire(type,params)_** | |||
| 触发事件 | |||
| - 参数 | |||
| - `{Object} type` :订阅类型 | |||
| - `{Object} params` :参数 | |||
| - 返回值 `this` | |||
| ### static methods | |||
| - **_registerType(type)_** | |||
| 注册图层类型 | |||
| - 参数 | |||
| - `{String} type`:图层类型 | |||
| - **_getLayerType()_** | |||
| 获取图层类型 | |||
| - 返回值 `string` | |||
| ## DC.LayerGroup | |||
| > 图层组,将图层按一定的逻辑分组,方便统一管理 | |||
| ### example | |||
| ```js | |||
| let layerGroup = new DC.LayerGroup('id') | |||
| viewer.addLayerGroup(layerGroup) | |||
| let layer = new DC.VectorLayer('layer') | |||
| layerGroup.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层组唯一标识 | |||
| - 返回值 `layerGroup` | |||
| ### properties | |||
| - `{String} id`:唯一标识 **_`readonly`_** | |||
| - `{Boolean} show`:是否显示 | |||
| - `{String} type`:图层类型 **_`readonly`_** | |||
| ### methods | |||
| - **_addLayer(layer)_** | |||
| 添加图层 | |||
| - 参数 | |||
| - `{Layer} layer`:图层 | |||
| - 返回值 `this` | |||
| - **_removeLayer(layer)_** | |||
| 删除图层 | |||
| - 参数 | |||
| - `{Layer} layer`:图层 | |||
| - 返回值 `this` | |||
| - **_getLayer(id)_** | |||
| 获取图层 | |||
| - 参数 | |||
| - `{String} id`:图层 ID | |||
| - 返回值 `layer` | |||
| - **_getLayers()_** | |||
| 获取所有图层,不包括地图 | |||
| - 返回值 `layer` | |||
| - **_remove()_** | |||
| 删除图层组 | |||
| - 返回值 `this` | |||
| - **_addTo(viewer)_** | |||
| 添加图层到场景 | |||
| - 参数 | |||
| - `{Viewer|World} viewer`:场景 | |||
| - 返回值 `this` | |||
| ## DC.VectorLayer | |||
| > 矢量图层,用于添加各类矢量数据(点、线、面等),将矢量数据按一定的逻辑分组,方便统一管理,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.VectorLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `vectorLayer` | |||
| ## DC.DynamicLayer | |||
| > 动态图层,用于添加各类动态矢量数据(图标、模型等),将矢量数据按一定的逻辑分组,方便统一管理,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.DynamicLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `dynamicLayer` | |||
| ## DC.PrimitiveLayer | |||
| > 图元图层,用于添加各类图元数据,将图元数据按一定的逻辑分组,方便统一管理,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.PrimitiveLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `primitiveLayer` | |||
| ## DC.GroundPrimitiveLayer | |||
| > 贴地图元图层,用于添加各类贴地图元数据,将贴地图元数据按一定的逻辑分组,方便统一管理,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.GroundPrimitiveLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `groundPrimitiveLayer` | |||
| ## DC.TilesetLayer | |||
| > 3dTiles 图层,用于添加 3dTiles 模型数据, 继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.TilesetLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `tilesetLayer` | |||
| ## DC.GeoJsonLayer | |||
| > GeoJson 图层,用于加载 GeoJson 格式数据,继承于[Layer](#dc-layer), | |||
| ### example | |||
| ```js | |||
| let layer = new DC.GeoJsonLayer('id', '**/**.geojson') | |||
| layer.eachOverlay((item) => { | |||
| // item 为一个entity, | |||
| if (item.polyline) { | |||
| //todo | |||
| let polyline = DC.Polyline.fromEntity(item) | |||
| } | |||
| if (item.polygon) { | |||
| //todo | |||
| let polygon = DC.Polygon.fromEntity(item) | |||
| } | |||
| if (item.billboard) { | |||
| //todo | |||
| let point = DC.Point.fromEntity(item) | |||
| let divIcon = DC.DivIcon.fromEntity(item) | |||
| let billboard = DC.Billboard.fromEntity(item) | |||
| } | |||
| }) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,url,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{String} url`:数据地址 | |||
| - `{Object} options`:属性配置,详情参考:[GeoJsonDataSource](http://resource.dvgis.cn/cesium-docs/GeoJsonDataSource.html) | |||
| - 返回值 `geoJsonLayer` | |||
| ### methods | |||
| - **_toVectorLayer()_** | |||
| 转换为矢量图层 | |||
| - 返回值 `vectorLayer` | |||
| - **_toModelLayer(modelUrl)_** | |||
| 转换为模型图层 | |||
| - 参数 | |||
| - `{String} modelUrl`:模型地址 | |||
| - 返回值 `vectorLayer` | |||
| ## DC.TopoJsonLayer | |||
| > TopoJson 图层,用于加载 TopoJson 格式数据,继承于[Layer](#dc-layer), | |||
| ### example | |||
| ```js | |||
| let layer = new DC.GeoJsonLayer('id', '**/**.geojson') | |||
| layer.eachOverlay((item) => { | |||
| // item 为一个entity, | |||
| if (item.polyline) { | |||
| //todo | |||
| let polyline = DC.Polyline.fromEntity(item) | |||
| } | |||
| if (item.polygon) { | |||
| //todo | |||
| let polygon = DC.Polygon.fromEntity(item) | |||
| } | |||
| if (item.billboard) { | |||
| //todo | |||
| let point = DC.Point.fromEntity(item) | |||
| let divIcon = DC.DivIcon.fromEntity(item) | |||
| let billboard = DC.Billboard.fromEntity(item) | |||
| } | |||
| }) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,url,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{String} url`:数据地址 | |||
| - `{Object} options`:属性配置,详情参考:[GeoJsonDataSource](http://resource.dvgis.cn/cesium-docs/GeoJsonDataSource.html) | |||
| - 返回值 `topoJsonLayer` | |||
| ### methods | |||
| - **_toVectorLayer()_** | |||
| 转换为矢量图层 | |||
| - 返回值 `vectorLayer` | |||
| - **_toModelLayer(modelUrl)_** | |||
| 转换为模型图层 | |||
| - 参数 | |||
| - `{String} modelUrl`:模型地址 | |||
| - 返回值 `vectorLayer` | |||
| ## DC.HtmlLayer | |||
| > Html 图层,用于加载 DivIcon 节点,继承于[Layer](#dc-layer), | |||
| ### example | |||
| ```js | |||
| let layer = new DC.HtmlLayer('dom') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id)_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - 返回值 `htmlLayer` | |||
| ## DC.CzmlLayer | |||
| > Czml 图层,用于加载 Czml 数据,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.CzmlLayer('id', '**/**.czml') | |||
| layer.eachOverlay((item) => { | |||
| if (item.polyline) { | |||
| //todo | |||
| } | |||
| if (item.polygon) { | |||
| //todo | |||
| } | |||
| if (item.billboard) { | |||
| //todo | |||
| } | |||
| }) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,url,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{String} url`:数据地址 | |||
| - `{Object} options`:属性配置,详情参考:[CzmlDataSource](http://resource.dvgis.cn/cesium-docs/CzmlDataSource.html) | |||
| - 返回值 `czmlLayer` | |||
| ## DC.KmlLayer | |||
| > Kml 图层,用于加载 Kml 数据,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.KmlLayer('id', '**/**.kml') | |||
| layer.eachOverlay((item) => { | |||
| if (item.polyline) { | |||
| //todo | |||
| } | |||
| if (item.polygon) { | |||
| //todo | |||
| } | |||
| if (item.billboard) { | |||
| //todo | |||
| } | |||
| }) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,url,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{String} url`:数据地址 | |||
| - `{Object} options`:属性配置,详情参考:[KmlDataSource](http://resource.dvgis.cn/cesium-docs/KmlDataSource.html) | |||
| - 返回值 `kmlLayer` | |||
| ## DC.GpxLayer | |||
| > GPX 图层,用于加载 gpx 数据,继承于[Layer](#dc-layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.GpxLayer('id', '**/**.gpx') | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,url,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{String} url`:数据地址 | |||
| - `{Object} options`:属性配置,详情参考:[GpxDataSource](http://resource.dvgis.cn/cesium-docs/GpxDataSource.html) | |||
| - 返回值 `gpxLayer` | |||
| ## DC.ClusterLayer | |||
| > 聚合图层,继承于[Layer](../dc-sdk/#layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.ClusterLayer('id',{image:''}) | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{Object} options`:属性配置 | |||
| - 返回值 `clusterLayer` | |||
| ```js | |||
| // 属性参数(可选) | |||
| { | |||
| "radius": 40,//像素范围 | |||
| "maxZoom": 25, | |||
| "image": "<单个点图片地址>", | |||
| "style": "circle", // circle 、 clustering 、custom | |||
| "gradientColors": { | |||
| "0.0001": DC.Color.DEEPSKYBLUE, | |||
| "0.001": DC.Color.GREEN, | |||
| "0.01": DC.Color.ORANGE, | |||
| "0.1": DC.Color.RED | |||
| },//幅度颜色设置 | |||
| "gradientImages": {},//幅度图片设置,仅当style为custom有效 | |||
| "clusterSize":16//集合图标尺寸 | |||
| "fontSize": 12, | |||
| // 字体大小 | |||
| "fontColor": DC.Color.BLACK //字体颜色 | |||
| "getCountOffset": (count)=>{return {x:0,y:0}} //字体偏移函数 | |||
| } | |||
| ``` | |||
| ### methods | |||
| - **_setPoints(points)_** | |||
| 设置点位 | |||
| - 参数 | |||
| - `{Array<Object>} points`:点位信息 | |||
| - 返回值 `clusterLayer` | |||
| ## DC.HeatMapLayer | |||
| > 热区图层,继承于[Layer](../dc-sdk/#layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.HeatMapLayer('layer') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,bounds,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{Object} options`:属性配置 | |||
| - 返回值 `heatMapLayer` | |||
| ```json | |||
| //属性参数(可选) | |||
| { | |||
| "gradient": { | |||
| "0.5": "green", | |||
| "0.6": "orange", | |||
| "0.95": "red" | |||
| }, //颜色设置 | |||
| "height": 0, // 高度 | |||
| "radius": 30, // 半径 | |||
| "useGround": false, //是否使用贴地模式 | |||
| "classificationType": 2 //分类 是否影响地形,3D切片或同时影响这两者。0:地形、1:3D切片、2:两者。贴地模式下生效 | |||
| } | |||
| ``` | |||
| ### methods | |||
| - **_setPoints(points)_** | |||
| 设置点位 | |||
| - 参数 | |||
| - `{Array<Object>} points`:点位信息 | |||
| - 返回值 `heatMapLayer` | |||
| ```json | |||
| //点位信息参数 | |||
| { | |||
| "lng": "", //经度 | |||
| "lat": "", //纬度 | |||
| "value": 10 //强度 | |||
| } | |||
| ``` | |||
| ## DC.WindLayer | |||
| > 风向图层,继承于[Layer](../dc-sdk/#layer) | |||
| ### example | |||
| ```js | |||
| let layer = new DC.WindLayer('id') | |||
| viewer.addLayer(layer) | |||
| ``` | |||
| ### creation | |||
| - **_constructor(id,[options])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:图层唯一标识 | |||
| - `{Object} options`:属性配置 | |||
| - 返回值 `windLayer` | |||
| ```json | |||
| //属性参数(可选) | |||
| { | |||
| "globalAlpha": 0.9, //透明度 | |||
| "lineWidth": 1, // 线宽 | |||
| "colorScale": "#fff", //颜色 | |||
| "velocityScale": 1 / 25, | |||
| "maxAge": 90, | |||
| "paths": 800, // 路径数 | |||
| "frameRate": 20, | |||
| "useCoordsDraw": true, | |||
| "gpet": true | |||
| } | |||
| ``` | |||
| ### methods | |||
| - **_setData(data,[options])_** | |||
| 设置风向数据 | |||
| - 参数 | |||
| - `{Object} data`:风向数据 | |||
| - `{Object} options`:配置信息,参考构造函数的配置信息 | |||
| - 返回值 `windLayer` | |||
| - **_setOptions(options)_** | |||
| 设置风向数据 | |||
| - 参数 | |||
| - `{Object} options`:配置信息,参考构造函数的配置信息 | |||
| - 返回值 `windLayer` | |||
| ## DC.ChartLayer | |||
| > 图表图层,继承于[Layer](../layer/#layer) | |||
| ### example | |||
| ```js | |||
| let chartLayer = new DC.ChartLayer('layer') | |||
| viewer.addLayer(chartLayer) | |||
| ``` | |||
| :::warning | |||
| 图表图层依赖于 echarts 库,使用前请确保全局变量中能够获取到 echarts | |||
| ::: | |||
| ### creation | |||
| - **_constructor([id],[option])_** | |||
| 构造函数 | |||
| - 参数 | |||
| - `{String} id`:唯一标识 | |||
| - `{Object} option`:echarts 配置,详情参考:[echarts](https://www.echartsjs.com/zh/option.html#title) | |||
| - 返回值 `chartLayer` | |||
| ```json | |||
| // options,其他的参数参考 echarts | |||
| { | |||
| "animation": false, // 必须要加 | |||
| "GLMap": {}, //地图 | |||
| "series": [ | |||
| { | |||
| "coordinateSystem": "GLMap" // 坐标系统 | |||
| } | |||
| ] | |||
| } | |||
| ``` | |||
| ### methods | |||
| - **_setOption(option)_** | |||
| 设置点位 | |||
| - 参数 | |||
| - `{Object} option`:echarts 配置,详情参考:[echarts](https://www.echartsjs.com/zh/option.html#title) | |||
| - 返回值 `this` | |||
| @@ -0,0 +1,19 @@ | |||
| # 赞助 | |||
| > DC-SDK 使用Apache 2.0的作为开源协议,完全自助研发;如果 DC-SDK 能够给您带来效益,请支持一下呗~` | |||
| ## 感谢 | |||
| > 以下列表为 DC 平台的赞助或打赏人员,排名不分先后,如果有什么隐私问题,请联系我 | |||
| `donkie` `Wchino` `莫慌` `凌风` `老戴` `蔺星` | |||
| ## 找到我们 | |||
| <p style='display: flex;justify-content:space-between'> | |||
| <img src="http://dc.dvgis.cn/examples/assets/images/base/q3.png?v=2" title="数字视觉" width="240px" height="332px" style='margin-right: 15px'/> | |||
| <img src="http://dc.dvgis.cn/examples/assets/images/base/q1.png?v=2" title="数字视觉(已满)" width="240px" height="332px" style='margin-right: 15px'/> | |||
| <img src="http://dc.dvgis.cn/examples/assets/images/base/q2.png?v=6" title="Cesium开心农场" width="240px" height="332px"/> | |||
| </p> | |||
| @@ -0,0 +1,45 @@ | |||
| --- | |||
| next: | |||
| text: '快速上手' | |||
| link: '/zh/guide/get-start' | |||
| --- | |||
| # 简介 | |||
| ## DC-SDK 是什么 | |||
| **_`DC-SDK`_** 是基于开源项目 **_`Cesium`_** 进行二次开发的二三维一体的 **_`WebGis`_** 应用框架,该框架优化了部分 **_`Cesium`_** 的使用方式和增添一些通用功能,旨在为开发者快速构建 **_`WebGis`_** 应用。 | |||
| ## DC-SDK 能做什么 | |||
| - `二、三维场景可视化` | |||
| 支持二三维无缝切换,一套代码多种风格。通过框架可以添加地图、各类矢量数据和模型到场景中,使场景更加贴近真实世界。 | |||
| - `各大厂商的地图管理` | |||
| 支持高德、百度、腾讯、天地图、Google、MapBox 等厂商的地图接入,对于国内部分地图可进行偏移处理。 | |||
| - `各类数据的统一管理` | |||
| 框架提供覆盖物对应的图层管理操作,通过图层可对覆盖物进行针对性的筛选和整体的控制。 | |||
| - `各类数据动画和特效` | |||
| 提供线、面、圆、模型等的材质效果和细节动画,让覆盖物的材质能够随着时间变化。 | |||
| - `三维场景后期的特效` | |||
| 提供云、雨、雪、雾等天气功能和包括绕点环绕、绕地环绕、扫描圈(雷达)、视频融合、泛光、夜视等一些动画以及后期特效。 | |||
| - `路径漫游和定点巡航` | |||
| 提供根据设定的路线进行自动漫游和巡航功能,方便重点区域定位查看。 | |||
| - `空间分析能力` | |||
| 提供测距、面积、高度等各种量算功能以及可视域、通视等三维场景分析功能。 | |||
| - `兼容第三方地图工具库` | |||
| 提供对 turf、heatmap、echarts 等常用可视化库和开源库的功能接入集成,避免用户的重复学习和成本投入。 | |||
| @@ -0,0 +1,5 @@ | |||
| # 架构图 | |||
| > DC 架构图,建议使用前先熟悉整体架构图,以便能够快速使用。[查看大图](https://dc.dvgis.cn/examples/assets/images/base/dc2.x.png) | |||
| <img src="https://dc.dvgis.cn/examples/assets/images/base/dc2.x.png" style="width:100%;height:800px"> | |||
| @@ -0,0 +1,21 @@ | |||
| # 从 2.x 迁移 | |||
| ## 修改框架引入方式修改 | |||
| ```js | |||
| // import DC from '@dvgis/dc-sdk/dist/dc.02.基础.min' | |||
| // import DcCore from '@dvgis/dc-sdk/dist/dc.core.min' | |||
| // import DcChart from '@dvgis/dc-sdk/dist/dc.chart.min' | |||
| // import DcMapv from '@dvgis/dc-sdk/dist/dc.mapv.min' | |||
| // import DcS3M from '@dvgis/dc-sdk/dist/dc.s3m.min' | |||
| // import '@dvgis/dc-sdk/dist/dc.core.min.css' | |||
| import * as DC from '@dvgis/dc-sdk' | |||
| import '@dvgis/dc-sdk/dist/dc.min.css' | |||
| ``` | |||
| ## 修改框架初始函数 | |||
| ```js | |||
| // DC.ready(initViewer) | |||
| DC.ready().then(initViewer) | |||
| ``` | |||
| @@ -0,0 +1,167 @@ | |||
| # 快速开始 | |||
| ## 框架安装 | |||
| `npm / yarn / pnpm` | |||
| npm / yarn / pnpm 的方式安装,它能更好地和 `webpack` 打包工具配合使用。 | |||
| ```shell | |||
| npm install @dvgis/dc-sdk | |||
| # yarn add @dvgis/dc-sdk | |||
| # pnpm add @dvgis/dc-sdk | |||
| ``` | |||
| ```js | |||
| import * as DC from '@dvgis/dc-sdk' | |||
| import '@dvgis/dc-sdk/dist/dc.core.min.css' | |||
| ``` | |||
| `CDN` | |||
| [下载链接](https://github.com/dvgis/dc-sdk/releases) | |||
| ```html | |||
| <script src="https://cdn.jsdelivr.net/npm/@dvgis/dc-sdk/dist/dc.min.js"></script> | |||
| <link | |||
| href="https://cdn.jsdelivr.net/npm/@dvgis/dc-sdk/dist/dc.min.css" | |||
| rel="stylesheet" | |||
| type="text/css" | |||
| /> | |||
| ``` | |||
| ## 创建应用 | |||
| > [框架安装](#框架安装) 和 [配置](#应用配置) 后,就可以开发属于自己的 **_`WebGis`_** 应用了 | |||
| `构建三维容器` | |||
| ```html | |||
| <div class="viewer-container" id="viewer-container"></div> | |||
| <!-- id属性必须赋值,否则无法创建三维场景 --> | |||
| ``` | |||
| `构建三维场景` | |||
| ```js | |||
| DC.ready().then(() => { | |||
| let viewer = new DC.Viewer('viewer-container') | |||
| }) | |||
| ``` | |||
| `运行效果` [更多示例](http://dc.dvgis.cn/#/examples) | |||
| <iframe src="https://dc.dvgis.cn/#/editor?type=start&subType=create&example=create" frameborder="0" height="500px" width="100%" > | |||
| </iframe> | |||
| ## 应用配置 | |||
| 由于 DC 框架将Cesium静态资源默认路径设置为 `./libs/dc-sdk/resources/`,这样需将 `Cesium` 相关的静态资源文件: `Assets`、`Workers` 、`ThirdParty` 复制到工程的 `libs/dc-sdk/resources` 目录下以保证三维场景能够正常呈现,也可通过全局函数进行 `Cesium` 相关的静态资源路基设置 | |||
| > `npm / yarn / pnpm` | |||
| `Webpack` [工程模板](https://github.com/cavencj/dc-vue-app) | |||
| ```js | |||
| // webpack.config.js | |||
| const path = require('path') | |||
| const CopywebpackPlugin = require('copy-webpack-plugin') | |||
| const dvgisDist = './node_modules/@dvgis' | |||
| module.exports = { | |||
| plugins: [ | |||
| new CopyWebpackPlugin([ | |||
| { | |||
| from: path.join(dvgisDist, 'dc-sdk/dist/resources'), | |||
| to: 'libs/dc-sdk/resources', | |||
| }, | |||
| ]), | |||
| ], | |||
| } | |||
| ``` | |||
| `Vue2.x` [工程模板](https://github.com/dvgis/dc-vue) | |||
| ```js | |||
| // vue.config.js | |||
| const path = require('path') | |||
| const CopywebpackPlugin = require('copy-webpack-plugin') | |||
| const dvgisDist = './node_modules/@dvgis' | |||
| module.exports = { | |||
| // 其他配置 | |||
| chainWebpack: (config) => { | |||
| config.plugin('copy').use(CopywebpackPlugin, [ | |||
| [ | |||
| { | |||
| from: path.join(dvgisDist, 'dc-sdk/dist/resources'), | |||
| to: 'libs/dc-sdk/resources', | |||
| }, | |||
| ], | |||
| ]) | |||
| }, | |||
| } | |||
| ``` | |||
| `Vue3.x` [工程模板](https://github.com/dvgis/dc-vue-next) | |||
| ```js | |||
| // vue.config.js | |||
| const path = require('path') | |||
| const CopywebpackPlugin = require('copy-webpack-plugin') | |||
| const dvgisDist = './node_modules/@dvgis' | |||
| module.exports = { | |||
| // 其他配置 | |||
| chainWebpack: (config) => { | |||
| config.plugin('copy').use(CopywebpackPlugin, [ | |||
| { | |||
| patterns: [ | |||
| { | |||
| from: path.join(dvgisDist, 'dc-sdk/dist/resources'), | |||
| to: path.join(__dirname, 'dist', 'libs/dc-sdk/resources'), | |||
| }, | |||
| ], | |||
| }, | |||
| ]) | |||
| }, | |||
| } | |||
| ``` | |||
| `Vite` [工程模板](https://github.com/dvgis/dc-vite) | |||
| ```shell | |||
| npm install @dvgis/vite-plugin-dc | |||
| # yarn add @dvgis/vite-plugin-dc | |||
| # pnpm add @dvgis/vite-plugin-dc | |||
| ``` | |||
| ```js | |||
| // vite.config.js | |||
| import { defineConfig } from "vite"; | |||
| import DC from "@dvgis/vite-plugin-dc"; | |||
| export default defineConfig({ | |||
| plugins: [DC()], | |||
| }); | |||
| ``` | |||
| `CDN` | |||
| 直接通过[网站](https://github.com/dvgis/dc-sdk/releases)下载当前版本的资源文件 | |||
| :::danger | |||
| CDN 模式下开发时尽量不要使用 DC 为变量名或者命名空间,避免框架无法正常使用。 | |||
| ::: | |||
| ## 代码提示 | |||
| 通过安装代码提示工具包,能够在开发过程中提示和自动完成框架内部的接口,更好地提高开发效率 | |||
| ```shell | |||
| npm install @dvgis/types -D | |||
| # yarn add @dvgis/types -D | |||
| # pnpm add @dvgis/types -D | |||
| ``` | |||
| @@ -0,0 +1,20 @@ | |||
| --- | |||
| layout: home | |||
| hero: | |||
| name: DC-SDK | |||
| text: 让 <code>WebGis</code> 开发更简单 | |||
| image: | |||
| src: /assets/doc.gif | |||
| alt: VitePress | |||
| actions: | |||
| - theme: brand | |||
| text: 快速开始 | |||
| link: /zh/guide/introduction | |||
| features: | |||
| - title: 简单 | |||
| details: 仅仅一个div和几行代码就能构建一个三维WebGis应用 | |||
| - title: 易用 | |||
| details: 采用标准的开发类,一个简单new操作即可得到场景要素 | |||
| - title: 可扩展 | |||
| details: 支持自定义cesium和gis算法库吗;提供基础类和要素生命周期hooks | |||
| --- | |||