История

Caven Chen 03bf5537bd add docs		преди 2 години
..
README.md	add docs	преди 2 години

Base 🌎

Namespace

DC

DC is the default namespace for the framework.When developing with this framework, you need to start with DC.
:::danger Try not to use DC as variable names or namespaces when developing to avoid the framework not working properly. :::

Cesium

Cesium is a world-class ES6 open source product for 3D GIS. The product is convenient for individuals or teams to quickly build a plug-in-free 3D GIS web application, in terms of performance, accuracy, rendering quality, cross-platform are very good guarantee. If you need Cesium’s internal interface during development, you can get Cesium through const { Cesium } = DC.Namespace.

mapv

Mapv is a geographic information visualization open source library , can be used to display a large amount of geographic information data , point , line , surface data , each data also has different types of display , such as direct hit points , heat map , grid , aggregation and other ways to display data . If you need Mapv’s internal interface during development, you can get Mapv through const { mapv } = DC.Namespace.

turf

Turf is a JavaScript library for spatial analysis. It includes traditional spatial operations, helper functions for creating GeoJSON data, and data classification and statistics tools. Turf can be added to your website as a client-side plugin, or you can run Turf server-side with Node.js . If you need Turf’s internal interface during development, you can get Turf through const { turf } = DC.Namespace.

Global Properties

version

Framework version number

accessToken

Used to remove logo and console output information. does not affect the use of the framework

DC.accessToken = '<your access token>'

:::tip Token requests can be made via http://dvgis.cn/#/price :::

baseUrl

Path to set the static resource files associated with Cesium: Assets, Workers, ThirdParty, Widgets

DC.baseUrl = '. /libs/dc-sdk/resources/'
DC.ready(() => {})

:::warning The baseUrl setting needs to be set before the ready function, otherwise the default setting of . /libs/dc-sdk/resources/ :::

Namespace

Namespace collection for third-party libraries

Global Methods

use

Using third-party modules or frameworks in DC frameworks

let plugin = {
  install: (DC) => {},
}
DC.use(plugin)

mixin

Adding additional properties or functions to the DC

let comp = {
  a: 'b',
}
DC.mixin(comp)
DC.a // b

init

This function is used to initialize Cesium, the default Cesium is the latest version, if you use a custom version of Cesium, you can modify the reference to Cesium before the DC loads other modules, thus replacing Cesium in the entire DC system (use with caution)

DC.init(() => {
  DC.Namespace['Cesium'] = '<自定义Cesium>'
  DC.use(DcCore)
})

ready

The main entrance to the framework, you must start with this when using the framework, otherwise you cannot build 3D scenes

global.DC = DC
DC.use(DcCore)
DC.ready(() => {
  let viewer = new DC.Viewer(divId)
})

Constants

Framework internal default constants

::: warning Please use the default constants for development :::

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

AnalysisType

DC.AnalysisType.CONTOUR_LINE

DC.AnalysisType.SHADOWS

DC.AnalysisType.SIGHT_CIRCLE

DC.AnalysisType.SIGHT_LINE

DC.AnalysisType.VIEWSHED

MouseMode

DC.MouseMode.LEFT_MIDDLE

DC.MouseMode.LEFT_RIGHT

ImageryType

DC.ImageryType.ARCGIS

DC.ImageryType.SINGLE_TILE

DC.ImageryType.WMS

DC.ImageryType.WMTS

DC.ImageryType.XYZ

DC.ImageryType.COORD

DC.ImageryType.GRID

DC.ImageryType.MAPBOX

DC.ImageryType.MAPBOX_STYLE

DC.ImageryType.TMS

DC.ImageryType.AMAP

DC.ImageryType.BAIDU

DC.ImageryType.GOOGLE

DC.ImageryType.TDT

DC.ImageryType.TENCENT

TerrainType

DC.TerrainType.NONE

DC.TerrainType.XYZ

DC.TerrainType.GOOGLE

DC.TerrainType.ARCGIS

DC.TerrainType.VR

LayerType

DC.LayerType.VECTOR

DC.LayerType.PRIMITIVE

DC.LayerType.TILESET

DC.LayerType.HTML

DC.LayerType.GEOJSON

DC.LayerType.CLUSTER

DC.LayerType.CAMERA_VIDEO

DC.LayerType.PLANE_VIDEO

DC.LayerType.KML

DC.LayerType.CZML

DC.LayerType.HEAT

DC.LayerType.MAPV

DC.LayerType.CHART

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

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

DC.OverlayType.CAMERA_VIDEO

DC.OverlayType.PLAN_VIDEO

TrackViewMode

DC.TrackViewMode.FP

DC.TrackViewMode.TP

DC.TrackViewMode.TRACKED

DC.TrackViewMode.FREE

DC.Viewer

3D scene primary interface to build 3D scenes in a given DivId, also available as DC.World

example

<div id="viewer-container"></div>

let viewer = DC.Viewer('viewer-container')
global.viewer = viewer

:::warning If you are using a MVVM framework like Vue, do not add viewer, layer, or overlay to the data model. Since the 3D scene will keep refreshing each frame, adding data to the data model will cause the browser to crash if it takes a long time. :::

creation

constructor(id,[options])
- parameters
- {String} id：divId
- {Object} options
- returns viewer

//options（optional）
{
  "contextOptions": {
    "webgl": {
      "alpha": false,
      "depth": true,
      "stencil": false,
      "antialias": true,
      "powerPreference": "high-performance",
      "premultipliedAlpha": true,
      "preserveDrawingBuffer": false,
      "failIfMajorPerformanceCaveat": false
    },
    "allowTextureFilterAnisotropic": true
  },
  "sceneMode": 3 //1: 2.5D，2: 2D，3: 3D
}

properties

{Element} dcContainer：custom container readonly
{Object} scene readonlyScene
{Object} camerareadonlyCamera
{Element} canvasreadonly
{Object} clockClock
{Object} dataSourcesDataSourceCollection
{Object} imageryLayersImageryLayerCollection
{Object} entitiesEntityCollection
{Popup} popupreadonly
{ContextMenu} contextMenureadonly
{Tooltip} tooltipreadonly
{MapSplit} mapSplitreadonly
{Compass} compassreadonly
{ZoomController} zoomControllerreadonly
{LocationBar} locationBarreadonly
{DistanceLegend} distanceLegendreadonly
{LoadingMask} loadingMaskreadonly
{Position} cameraPositionreadonly
{Number} resolutionreadonly
{Number} levelreadonly
{Rect} viewBoundsreadonly

methods

setOptions(options)
- parameters
- {Object} options：属性对象
- returns this

// options(optional)
{
  "shadows": false,
  "resolutionScale": 1,
  "showAtmosphere": true,
  "showSun": true,
  "showMoon": true,
  "enableFxaa": true,
  "msaaSamples": 1,
  "cameraController": {
    "enableRotate": true,
    "enableTilt": true,
    "enableTranslate": true,
    "enableZoom": true,
    "enableCollisionDetection": true,
    "minimumZoomDistance": 1.0,
    "maximumZoomDistance": 40489014.0
  },
  "globe": {
    "show": true,
    "showGroundAtmosphere": true,
    "enableLighting": false,
    "depthTestAgainstTerrain": false,
    "tileCacheSize": 100,
    "preloadSiblings": false,
    "terrainExaggeration": 1,
    "terrainExaggerationRelativeHeight": 1,
    "baseColor": new DC.Color(0, 0, 0.5, 1),
    "filterColor": new DC.Color(0, 0, 0, 0),
    "translucency": {
      "enabled": false,
      "backFaceAlpha": 1,
      "backFaceAlphaByDistance": null,
      "frontFaceAlpha": 1,
      "frontFaceAlphaByDistance": null
    }
  },
  "skyBox": {
    "sources": {},
    "show": true,
    "offsetAngle": 0
  }
}

setPitchRange(min,max)
- parameters
- {Number} min：min angel
- {Number} max：max angel
- returns this
changeSceneMode(sceneMode, [duration])
- parameters
- {Number} sceneMode: 2：2D，3：3D，2.5：2.5D
- {Number} duration
- returns this
changeMouseMode(mouseMode)
- parameters
- {Number} mouseMode, Refer to：DC.MouseMode
- returns this
addBaseLayer(baseLayers,[options])
- parameters
- {baseLayer|Array<baseLayer>} baseLayers
- {Object} options
- returns this

//options
{
  "name": "map",
  "iconUrl": "../preview.png"
}

changeBaseLayer(index)
- parameters
- {Number} index
- returns this
getImageryLayerInfo(windowPosition)
- parameters
- {Object} windowPosition
- returns promise
addTerrain(terrain)
- parameters
- {Terrain} terrain
- returns this
changeTerrain(index)
- parameters
- {Number} index
- returns this
removeTerrain()
- returns this
addLayerGroup(layerGroup)
- parameters
- {LayerGroup} layerGroup
- returns this
removeLayerGroup(layerGroup)
- parameters
- {LayerGroup} layerGroup
- returns this
getLayerGroup(id)
- parameters
- {String} id
- returns layerGroup
addLayer(layer)
- parameters
- {Layer} layer
- returns this
removeLayer(layer)
- parameters
- {Layer} layer
- returns this
getLayer(id)
- parameters
- {String} id:layer id
- returns layer
getLayers()
- returns layer
eachLayer(callback, context)
- parameters
- {Function} callback
- {Object} context
- returns this

  viewer.eachLayer((layer) => {})

flyTo(target,[duration])
- parameters
- {VectorLayer|Overlay} target
- {Number} duration
- returns this
zoomTo(target)
- parameters
- {VectorLayer|Overlay} target
- returns this
flyToPosition(position, [completeCallback], [duration])
- parameters
- {Position} position
- {Function} completeCallback
- {Number} duration
- returns this
zoomToPosition(position, [completeCallback])
- parameters
- {DC.Position} position
- {Function} completeCallback
- returns this
flyToBounds(bounds,{heading,pitch,roll}, completeCallback, duration)
- parameters
- {String|Array} bounds format:[minX,minY,maxX,maxY]
- {Object} hpr
- {Function} completeCallback
- {Number} duration
- returns this
zoomToBounds(bounds,{heading,pitch,roll}, completeCallback)
- parameters
- {String|Array} bounds format:[minX,minY,maxX,maxY]
- {Object} hpr
- {Function} completeCallback
- returns this
on(type, callback, [context])
- parameters
- {Object} type
- {Function} callback
- {Object} context
- returns this
once(type, callback, [context])
- parameters
- {Object} type
- {Function} callback
- {Object} context
- returns this
off(type, callback, [context])
- parameters
- {Object} type
- {Function} callback
- {Object} context
- returns this
destroy()
- returns this
exportScene([name])
- parameters
- {String} name
- returns this
use(plugin)
- parameters
- {Object} plugin
- returns this

  let plugin = {
    install: (viewer) => {},
  }
  viewer.use(plugin)

example

let popup = viewer.popup
popup.setContent('<div></div>')

properties

{String} statereadonly
{Object} configwriteOnly

{
  "position": "center", // center，left ，right
  "customClass": "custom" // Add a custom Css class name to the popup, separating multiple names with spaces
}

methods

setPosition(position)
- parameters
- {Cartesian3} position: World Coordinates
- returns this
setContent(content)
- parameters
- {String|Element} content
- returns this
setWrapper(wrapper)
- parameters
- {Element} wrapper(Templates for MVVM frameworks in general)
- returns this
showAt(position, content)
- parameters
- {Cartesian3} position
- {String|Element} content
- returns this
hide()
- returns this

ContextMenu

example

let contextMenu = viewer.contextMenu
contextMenu.enable = true
contextMenu.DEFAULT_MENU = [
  {
    label: '测试',
    callback: (e) => {}, // e: windowPosition,position,surfacePosition,overlay
    context: this,
  },
] // Setting the default ContextMenu affects the global ContextMenu (use with caution).

properties

{Boolean} enable
{String} statereadonly
{Array} DEFAULT_MENU：writeOnly

example

let tooltip = viewer.tooltip
tooltip.enable = true
tooltip.showAt({ x: 100, y: 100 }, 'test')

properties

{Boolean} enable
{String} state readonly

methods

showAt(position,content)
- parameters
- {Cartesian2} position: Screen Coordinates
- {String|Element} content
- returns this

MapSplit

examples

let baseLayer_elc = DC.ImageryLayerFactory.createGoogleImageryLayer()
viewer.mapSplit.enable = true
viewer.mapSplit.addBaseLayer(baseLayer_elc, -1)

properties

{Boolean} enable
{String} statereadonly

methods

addBaseLayer(baseLayer,splitDirection)
- parameters
- {BaseLayer} baseLayer
- {Number} splitDirection,-1：left，0：none，1：right
- returns this

Compass

examples

viewer.compass.enable = true

properties

{Boolean} enable
{String} state readonly

ZoomController

examples

viewer.zoomController.enable = true

properties

{Boolean} enable
{String} statereadonly

LocationBar

examples

viewer.locationBar.enable = true

properties

{Boolean} enable
{String} state readonly

DistanceLegend

examples

viewer.distanceLegend.enable = true

properties

{Boolean} enable
{String} state,readonly

LoadingMask

examples

viewer.loadingMask.enable = true

properties

{Boolean} enable
{String} statereadonly

DC.SkyBox

example

scene.skyBox = new DC.SkyBox({
  sources: {
    positiveX: 'skybox_px.png',
    negativeX: 'skybox_nx.png',
    positiveY: 'skybox_py.png',
    negativeY: 'skybox_ny.png',
    positiveZ: 'skybox_pz.png',
    negativeZ: 'skybox_nz.png',
  },
})

creation

constructor(id)
- parameters
- {Object} options
- returns skyBox

//options(optional)
{
  "sources": {},
  "show": true
}

properties

{Object} sources
{Boolean} show

DC.GroundSkyBox

example

scene.skyBox = new DC.GroundSkyBox({
  sources: {
    positiveX: 'skybox_px.png',
    negativeX: 'skybox_nx.png',
    positiveY: 'skybox_py.png',
    negativeY: 'skybox_ny.png',
    positiveZ: 'skybox_pz.png',
    negativeZ: 'skybox_nz.png',
  },
})

creation

constructor(id)
- parameters
- {Object} options
- returns groundSkyBox

//options(optional)
{
  "sources": {},
  "show": true,
  "offsetAngle": 0
}

properties

{Object} sources
{Boolean} show
{Number} offsetAngle

DC.Position

example

let position = new DC.Position(120, 22, 102)

let position1 = DC.Position.fromString('120,22,102')

let position2 = DC.Position.fromArray([120, 22, 102])

let position3 = DC.Position.fromObject({ lng: 120, lat: 22, height: 102 })

creation

constructor(lng,lat,[alt],[heading],[pitch],[roll])
- parameters
- {Number} lng
- {Number} lat
- {Number} alt
- {Number} heading
- {Number} pitch
- {Number} roll
- returns position

properties

{Number} lng
{Number} lat
{Number} alt
{Number} heading
{Number} pitch
{Number} roll

methods

serialize()
- returns string
copy()
- returns position
toString()
- returns string
toArray()
- returns array
toObject()
- returns Object

static methods

fromString(str)
- parameters
- {String} str
- returns position
fromArray(array)
- parameters
- {Array} array
- returns position
fromObject(obj)
- parameters
- {Object} obj
- returns position
deserialize(valStr)
- parameters
- {String} valStr
- returns position

DC.Color

example

let red = DC.Color.RED

properties

{Color} RED
{Color} YELLOW
{Color} WHITE
{Color} GREEN

others

DC.TilesetStyle

example

let style = new DC.TilesetStyle()
style.color = {
  conditions: [
    ['${floor} >= 5', 'rgb(198, 106, 11)'],
    ['true', 'rgb(127, 59, 8)'],
  ],
}

Cesium3DTileStyle

DC.JulianDate

let date = DC.JulianDate.now()

static methods

now()
- returns date
fromDate(date)
- parameters
- {Date} date
- returns date

JulianDate

DC.Rect

example

let r = DC.Rect.fromDegrees(10, 20, 12, 31)

Rectangle

DC.CallbackProperty

let position = new DC.Position(120, 20)
let point = new DC.Point(position)
let size = 0
point.setStyle({
  pixelSize: new DC.CallbackProperty((time) => {
    size += 1
    if (size == 10) {
      size = 0
    }
    return size
  }),
})

CallbackProperty

DC.Parse

Coordinate resolution tool class, can be abbreviated as DC.P

let position = DC.P.parsePosition('123,32,0')

static methods

parsePosition(position)
- parameters
- {String|Array|Position} position
- returns position
parsePositions(positions)
- parameters
- {String|Array} positions
- returns array
parsePointCoordToArray(position)
- parameters
- {String|Position} position
- returns array
parsePolylineCoordToArray(positions)
- parameters
- {String|Array} positions
- returns array
parsePolygonCoordToArray(positions，loop)
- parameters
- {String|Array} positions
- {Boolean} loop
- returns array

DC.Transform

Coordinate conversion tool class , can be abbreviated DC.T

let cartesian3 = DC.T.transformWGS84ToCartesian(new DC.Position(120, 20))

static methods

transformCartesianToWGS84(cartesian)
- parameters
- {Cartesian3} cartesian
- returns position
transformWGS84ToCartesian(position)
- parameters
- {Position} position
- returns cartesian
transformWGS84ToCartographic(position)
- parameters
- {Position} position
- returns cartographic
transformCartesianArrayToWGS84Array(cartesianArr)
- parameters
- {Array<cartesian3>} cartesianArr
- returns array
transformWGS84ArrayToCartesianArray(WGS84Arr)
- parameters
- {Array<cartesian3>} WGS84Arr
- returns array
transformWGS84ToMercator(position)
- parameters
- {Position} position
- returns position
transformMercatorToWGS84(position)
- parameters
- {Position} position
- returns position
transformWindowToWGS84(position,viewer)
- parameters
- {Object} position,format:{x:1,y:1}
- {Viewer} viewer
- returns position
transformWGS84ToWindow(position,viewer)
- parameters
- {Position} position
- {Viewer} viewer
- returns Object

DC.CoordTransform

China Coordinate Conversion Tool

let point = DC.CoordTransform.BD09ToGCJ02(120, 20)

static methods

BD09ToGCJ02(lng, lat)
- parameters
- {Number} lng
- {Number} lat
- returns []
GCJ02ToBD09(lng, lat)
- parameters
- {Number} lng
- {Number} lat
- returns []
WGS84ToGCJ02(lng, lat)
- parameters
- {Number} lng
- {Number} lat
- returns []
GCJ02ToWGS84(lng, lat)
- parameters
- {Number} lng
- {Number} lat
- returns []

DC.Math

static methods

area(positions)
- parameters
- {Array<Position>} positions
- returns number
bounds(positions , expand)
- parameters
- {Array<Position>} positions
- {Number}} expand:0~1
- returns object
mid(startPosition , endPosition)
- parameters
- {Position} startPosition
- {Position} endPosition
- returns position
center(positions)
- parameters
- {Array<Position>} positions
- returns position
distance(positions)
- parameters
- {Array<Position>} positions
- returns number
heading(startPosition, endPosition)
- parameters
- {Position} startPosition
- {Position} endPosition
- returns number
parabola(startPosition, endPosition,height,count)
- parameters
- {Position} startPosition
- {Position} endPosition
- {Number} height
- {Number} count
- returns Array

more

DC.Util

static methods

uuid([prefix])
- parameters
- {String} prefix
- returns string
merge(dest, …sources)
- parameters
- {Object} dest
- {Object|Array} sources
- returns object
emptyImageUrl()
debounce(fn,delay)
throttle(fn,delay)

DC.DomUtil

static methods

get(id)
- parameters
- {String} id
- returns Element
create(tagName, className, [container])
- parameters
- {String} tagName
- {String} className
- {Element} [container]
- returns Element
addClass(el, name)
- parameters
- {Element} el
- {String} className
removeClass(el, name)
- parameters
- {Element} el
- {String} className
addClass(el, name)
- parameters
- {Element} el
- {String} className
createSvg(width, height, path, [container])
- parameters
- {Number} width
- {Number} height
- {String} path
- {Element} [container]
- returns svg
parseDom(domStr, [withWrapper], [className])
- parameters
- {String} domStr
- {Boolean} withWrapper
- {String} className
- returns Element | Nodes
enterFullscreen(el)
- parameters
- {Element} el
exitFullscreen()
createVideo(url, className, [container])
- parameters
- {String} url
- {String} className
- {Element} [container]
- returns Element | Nodes

README.md

sidebar: auto

Base 🌎

Namespace

Global Properties

version

accessToken

baseUrl

Namespace

Global Methods

use

mixin

init

ready

Constants

MouseEventType

SceneEventType

AnalysisType

MouseMode

ImageryType

TerrainType

LayerType

OverlayType

TrackViewMode

DC.Viewer

example

creation

properties

methods

Popup

example

properties

methods

ContextMenu

example

properties

Tooltip

example

properties

methods

MapSplit

examples

properties

methods

Compass

examples

properties

ZoomController

examples

properties

LocationBar

examples

properties

DistanceLegend

examples

properties

LoadingMask

examples

properties

DC.SkyBox

example

creation

properties

DC.GroundSkyBox

example

creation

properties

DC.Position

example

creation

properties

methods

static methods

DC.Color

example

properties

DC.TilesetStyle

example

DC.JulianDate

static methods