OpenSource
/
dc-sdk
mirror of https://github.com/dvt3d/dc-sdk
Watch 4
Star 0
Fork 0
Code Issues 0 Releases 92 Wiki Activity
Browse Source

improve the mouse event

pull/218/head
chenjing 1 month ago
parent
e810a4a289
commit
4cc8d7f71c
15 changed files with 386 additions and 348 deletions
Unified View Show Diff Stats
  1. 8
    0
      examples/list.js
  2. 32
    0
      examples/model/3dtiles_3dgs.html
  3. 52
    0
      examples/vector/radar_outer.html
  4. 2
    4
      examples/vector/wall.html
  5. 1
    1
      package.json
  6. 10
    25
      src/modules/event/EventType.js
  7. 135
    184
      src/modules/event/type/MouseEvent.js
  8. 16
    125
      src/modules/index.js
  9. 1
    0
      src/modules/material/index.js
  10. 54
    0
      src/modules/material/property/radar/RadarOuterMaterialProperty.js
  11. 16
    0
      src/modules/material/shader/radar/RadarOuterMaterial.glsl
  12. 22
    0
      src/modules/material/type/radar.js
  13. 0
    2
      src/modules/option/ViewerOption.js
  14. 7
    3
      src/modules/overlay/vector/Polyline.js
  15. 30
    4
      src/modules/viewer/Viewer.js

+ 8
- 0
examples/list.js View File

name: '波纹雷达', name: '波纹雷达',
page: 'radar_wave.html', page: 'radar_wave.html',
}, },
{
name: '雷达脉冲',
page: 'radar_outer.html',
},
{ {
name: '墙', name: '墙',
page: 'wall.html', page: 'wall.html',
name: '3dtiles-osgb', name: '3dtiles-osgb',
page: '3dtiles_osgb.html', page: '3dtiles_osgb.html',
}, },
{
name: '3dtiles-3dgs',
page: '3dtiles_3dgs.html',
},
{ {
name: '3dtiles-shp', name: '3dtiles-shp',
page: '3dtiles_shp.html', page: '3dtiles_shp.html',

+ 32
- 0
examples/model/3dtiles_3dgs.html View File

<!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>
<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>
DC.config.baseUrl = '../libs/dc-sdk/resources/'
let viewer = new DC.Viewer('viewer-container')
let baseLayer = DC.ImageryLayerFactory.createImageryLayer(
DC.ImageryType.AMAP,
{
style: 'img',
crs: 'WGS84'
}
)
viewer.addBaseLayer(baseLayer)
let layer = new DC.TilesetLayer('layer')
viewer.addLayer(layer)
let tileset = new DC.Tileset('//resource.dvgis.cn/data/3dtiles/cesium-gs/tileset.json')
layer.addOverlay(tileset)
viewer.flyTo(tileset)
</script>
</body>
</html>

+ 52
- 0
examples/vector/radar_outer.html View File

<!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>
<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>

DC.config.baseUrl = '../libs/dc-sdk/resources/'
let viewer = new DC.Viewer('viewer-container')
let baseLayer = DC.ImageryLayerFactory.createAMapImageryLayer({
style: 'img',
crs: 'WGS84'
})
viewer.addBaseLayer(baseLayer)
let layer = new DC.VectorLayer('layer')
viewer.addLayer(layer)
let redCylinder = new DC.Cylinder('120.1,32,10000', 20000, 5000, 0)
redCylinder.setStyle({
material: new DC.RadarOuterMaterialProperty({
color: DC.Color.RED
})
})
let greenCylinder = new DC.Cylinder('120.3, 32.0,10000', 20000, 0, 5000)
greenCylinder.setStyle({
material: new DC.RadarOuterMaterialProperty({
color: DC.Color.GREEN
})
})
let blueCylinder = new DC.Cylinder('120.5, 32.0,10000', 20000, 5000, 0)
blueCylinder.setStyle({
material: new DC.RadarOuterMaterialProperty(
{
color: DC.Color.BLUE
}
)
})
layer
.addOverlay(redCylinder)
.addOverlay(greenCylinder)
.addOverlay(blueCylinder)
viewer.flyTo(layer)
</script>
</body>
</html>

+ 2
- 4
examples/vector/wall.html View File



<div id="viewer-container" class="viewer-container"></div> <div id="viewer-container" class="viewer-container"></div>
<script> <script>
DC.config.baseUrl = '../libs/dc-sdk/resources/'
let viewer = new DC.Viewer('viewer-container')
DC.config.baseUrl = '../libs/dc-sdk/resources/'
let viewer = new DC.Viewer('viewer-container')
let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{ let baseLayer = DC.ImageryLayerFactory.createImageryLayer(DC.ImageryType.AMAP,{
style:'img', style:'img',
crs:'WGS84', crs:'WGS84',
material: DC.Color.RED, material: DC.Color.RED,
outline: true outline: true
}) })
layer.addOverlay(wall)
viewer.flyTo(layer) viewer.flyTo(layer)

</script> </script>
</body> </body>
</html> </html>

+ 1
- 1
package.json View File

"dist" "dist"
], ],
"dependencies": { "dependencies": {
"cesium": "^1.132.0",
"cesium": "^1.133.1",
"supercluster": "^8.0.1" "supercluster": "^8.0.1"
} }
} }

+ 10
- 25
src/modules/event/EventType.js View File

REMOVE: 'remove', REMOVE: 'remove',
} }


const MouseEventType = {
const BaseMouseEventType = {
LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN, LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN,
LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP, LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP,
CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK, CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK,
RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP, RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP,
RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK, RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK,
DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK, DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
}

const MouseEventType = {
...BaseMouseEventType,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE, MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
WHEEL: Cesium.ScreenSpaceEventType.WHEEL, WHEEL: Cesium.ScreenSpaceEventType.WHEEL,
MOUSE_OVER: 'mouseover', MOUSE_OVER: 'mouseover',
} }


const ViewerEventType = { const ViewerEventType = {
...BaseMouseEventType,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
WHEEL: Cesium.ScreenSpaceEventType.WHEEL,
ADD_LAYER: 'addLayer', ADD_LAYER: 'addLayer',
REMOVE_LAYER: 'removeLayer', REMOVE_LAYER: 'removeLayer',
ADD_EFFECT: 'addEffect', ADD_EFFECT: 'addEffect',
REMOVE_EFFECT: 'removeEffect', REMOVE_EFFECT: 'removeEffect',
LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN,
LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP,
CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK,
RIGHT_DOWN: Cesium.ScreenSpaceEventType.RIGHT_DOWN,
RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP,
RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK,
DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
WHEEL: Cesium.ScreenSpaceEventType.WHEEL,
} }


const SceneEventType = { const SceneEventType = {


const OverlayEventType = { const OverlayEventType = {
...BaseEventType, ...BaseEventType,
LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN,
LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP,
CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK,
RIGHT_DOWN: Cesium.ScreenSpaceEventType.RIGHT_DOWN,
RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP,
RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK,
DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
...BaseMouseEventType,
MOUSE_OVER: 'mouseover', MOUSE_OVER: 'mouseover',
MOUSE_OUT: 'mouseout', MOUSE_OUT: 'mouseout',
POSITION_UPDATE: 'positionUpdate', POSITION_UPDATE: 'positionUpdate',


const LayerEventType = { const LayerEventType = {
...BaseEventType, ...BaseEventType,
LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN,
LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP,
CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK,
RIGHT_DOWN: Cesium.ScreenSpaceEventType.RIGHT_DOWN,
RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP,
RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK,
DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
...BaseMouseEventType,
} }


const TrackEventType = { const TrackEventType = {

+ 135
- 184
src/modules/event/type/MouseEvent.js View File

this._addDefaultEvent() this._addDefaultEvent()
} }


set enableEventPropagation(enableEventPropagation) {
this._enableEventPropagation = enableEventPropagation
}

get enableEventPropagation() {
return this._enableEventPropagation
}

set enableMouseOver(enableMouseOver) {
this._enableMouseOver = enableMouseOver
}

get enableMouseOver() {
return this._enableMouseOver
}

set enableMouseMovePick(enableMouseMovePick) {
this._enableMouseMovePick = enableMouseMovePick
}

get enableMouseMovePick() {
return this._enableMouseMovePick
}

/** /**
* *
* @private * @private


/** /**
* *
* @param {*} position
* @param {*} windowPosition
* @returns * @returns
*/ */
_getMousePosition(position) {
_getMousePosition(windowPosition) {
let scene = this._viewer.scene let scene = this._viewer.scene
let cartesian = undefined
let surfaceCartesian = undefined
let position = undefined
let wgs84Position = undefined let wgs84Position = undefined
let surfacePosition = undefined
let wgs84SurfacePosition = undefined let wgs84SurfacePosition = undefined
if (scene.pickPositionSupported) {
cartesian = scene.pickPosition(position)
}
if (cartesian) {

const cartesianToWGS84 = (cartesian) => {
if (!cartesian) {
return undefined
}
let c = Cesium.Ellipsoid.WGS84.cartesianToCartographic(cartesian) let c = Cesium.Ellipsoid.WGS84.cartesianToCartographic(cartesian)
if (c) {
wgs84Position = {
lng: Cesium.Math.toDegrees(c.longitude),
lat: Cesium.Math.toDegrees(c.latitude),
alt: c.height,
}
if (!c) {
return undefined
}
return {
lng: Cesium.Math.toDegrees(c.longitude),
lat: Cesium.Math.toDegrees(c.latitude),
alt: c.height,
} }
} }

if (scene.pickPositionSupported) {
position = scene.pickPosition(windowPosition)
wgs84Position = cartesianToWGS84(position)
}

if ( if (
scene.mode === Cesium.SceneMode.SCENE3D && scene.mode === Cesium.SceneMode.SCENE3D &&
!(this._viewer.terrainProvider instanceof Cesium.EllipsoidTerrainProvider) !(this._viewer.terrainProvider instanceof Cesium.EllipsoidTerrainProvider)
) { ) {
let ray = scene.camera.getPickRay(position)
surfaceCartesian = scene.globe.pick(ray, scene)
let ray = scene.camera.getPickRay(windowPosition)
surfacePosition = scene.globe.pick(ray, scene)
} else { } else {
surfaceCartesian = scene.camera.pickEllipsoid(
position,
surfacePosition = scene.camera.pickEllipsoid(
windowPosition,
Cesium.Ellipsoid.WGS84 Cesium.Ellipsoid.WGS84
) )
} }
if (surfaceCartesian) {
let c = Cesium.Ellipsoid.WGS84.cartesianToCartographic(surfaceCartesian)
if (c) {
wgs84SurfacePosition = {
lng: Cesium.Math.toDegrees(c.longitude),
lat: Cesium.Math.toDegrees(c.latitude),
alt: c.height,
}
}
}
wgs84SurfacePosition = cartesianToWGS84(surfacePosition)
return { return {
windowPosition: position,
position: cartesian,
wgs84Position: wgs84Position,
surfacePosition: surfaceCartesian,
wgs84SurfacePosition: wgs84SurfacePosition,
windowPosition,
position,
wgs84Position,
surfacePosition,
wgs84SurfacePosition,
} }
} }




/** /**
* Gets the drill pick overlays for the mouse event * Gets the drill pick overlays for the mouse event
* @param position
* @returns {[]}
* @param windowPosition
* @param exclude
* @returns {*[]}
* @private * @private
*/ */
_getDrillInfos(position) {
_getDrillInfos(windowPosition, exclude) {
let drillInfos = [] let drillInfos = []
let scene = this._viewer.scene
let targets = scene.drillPick(position)
if (targets && targets.length) {
targets.forEach((target) => {
drillInfos.push(this._getTargetInfo(target))
})
const scene = this._viewer.scene
const targets = scene.drillPick(windowPosition) || []
for (const target of targets) {
const targetInfo = this._getTargetInfo(target)
if (targetInfo?.overlay?.overlayId !== exclude.overlayId) {
drillInfos.push(targetInfo)
}
} }
return drillInfos return drillInfos
} }


/** /**
* Return the Overlay id
*
* @param target * @param target
* @returns {any}
* @returns {{overlayId: (function(): Overlay._id)|*, layerId: (function(): Layer._id)|string|*, object: undefined, feature: undefined}}
* @private * @private
*/ */
_getOverlayId(target) {
let overlayId = undefined

// for Entity
_getTargetObject(target) {
let feature = null
let object = null
if (target?.id instanceof Cesium.Entity) { if (target?.id instanceof Cesium.Entity) {
overlayId = target.id.overlayId
}

// for Cesium3DTileFeature
else if (target instanceof Cesium.Cesium3DTileFeature) {
overlayId = target.tileset.overlayId
}

// for Cesium3DTileset
else if (target?.primitive instanceof Cesium.Cesium3DTileset) {
overlayId = target.primitive.overlayId
object = target.id
} else if (target instanceof Cesium.Cesium3DTileFeature) {
object = target.tileset
feature = target
} else if (target?.primitive instanceof Cesium.Cesium3DTileset) {
object = target.primitive
} else if (target?.primitive) {
object = target.primitive
} }

// for Primitive
else if (target?.primitive) {
overlayId = target.primitive.overlayId
return {
overlayId: object?.overlayId,
layerId: object?.layerId,
object,
feature,
} }

return overlayId
} }


/** /**
* @private * @private
*/ */
_getTargetInfo(target) { _getTargetInfo(target) {
let overlay = undefined
let layer = undefined
let feature = undefined
// for Entity
if (target?.id instanceof Cesium.Entity) {
layer = this._viewer
.getLayers()
.filter((item) => item.layerId === target.id.layerId)[0]
if (layer?.getOverlay) {
overlay = layer.getOverlay(target.id.overlayId)
const { overlayId, layerId, feature } = this._getTargetObject(target)
const layers = this._viewer.getLayers()
const layer = layerId
? layers.find((item) => item.layerId === layerId)
: null
const overlay =
overlayId && layer?.getOverlay ? layer.getOverlay(overlayId) : null
if (overlay && feature?.getPropertyNames) {
let propertyNames = feature.getPropertyNames() || []
for (const propertyName of propertyNames) {
overlay.attr[propertyName] = feature.getProperty(propertyName)
} }
} }

// for Cesium3DTileFeature
else if (target instanceof Cesium.Cesium3DTileFeature) {
layer = this._viewer
.getLayers()
.filter((item) => item.layerId === target.tileset.layerId)[0]
feature = target
if (layer?.getOverlay) {
overlay = layer.getOverlay(target.tileset.overlayId)
if (feature && feature.getPropertyNames) {
let propertyNames = feature.getPropertyNames()
propertyNames.forEach((item) => {
overlay.attr[item] = feature.getProperty(item)
})
}
}
}

// for Cesium3DTileset
else if (target?.primitive instanceof Cesium.Cesium3DTileset) {
layer = this._viewer
.getLayers()
.filter((item) => item.layerId === target.primitive.layerId)[0]
if (layer?.getOverlay) {
overlay = layer.getOverlay(target.primitive.overlayId)
}
}

// for Primitive
else if (target?.primitive) {
layer = this._viewer
.getLayers()
.filter((item) => item.layerId === target.primitive.layerId)[0]
if (layer?.getOverlay) {
overlay = layer.getOverlay(target.primitive.overlayId)
}
}

return { return {
layer: layer, layer: layer,
overlay: overlay, overlay: overlay,
* @private * @private
*/ */
_raiseEvent(type, mouseInfo = {}) { _raiseEvent(type, mouseInfo = {}) {
let event = undefined
let targetInfo = this._getTargetInfo(mouseInfo.target)
let overlay = targetInfo?.overlay
let layer = targetInfo?.layer

// get Overlay Event
if (overlay?.overlayEvent) {
event = overlay.overlayEvent.getEvent(type)
event &&
event.numberOfListeners > 0 &&
event.raiseEvent({
...targetInfo,
...mouseInfo,
})
const targetInfo = this._getTargetInfo(mouseInfo.target) || {}
const { overlay, layer } = targetInfo

const doRaise = (eventHost, payload) => {
if (!eventHost || typeof eventHost.getEvent !== 'function') return false
const event = eventHost.getEvent(type)
if (!event || event.numberOfListeners <= 0) return false
event.raiseEvent(payload)
return true
} }


// get Layer Event
if (
(!event || event.numberOfListeners === 0 || this._eventPropagation) &&
layer?.layerEvent
) {
event = layer.layerEvent.getEvent(type)
event &&
event.numberOfListeners > 0 &&
event.raiseEvent({
...targetInfo,
...mouseInfo,
})
// raise event for overlay
const eventParams = { ...targetInfo, ...mouseInfo }
let handled = doRaise(overlay?.overlayEvent, eventParams)
if (overlay?.allowDrillPicking) {
const drillInfos =
this._getDrillInfos(mouseInfo.windowPosition, overlay) || []
for (const drillInfo of drillInfos) {
const dOverlay = drillInfo?.overlay
const dLayer = drillInfo?.layer
const drillEventParams = { ...drillInfo, ...mouseInfo }
let dHandled = doRaise(dOverlay.overlayEvent, drillEventParams)
if (!dHandled) {
doRaise(dLayer?.layerEvent, drillEventParams)
}
}
} }


// get Viewer Event
if (
(!event ||
event.numberOfListeners === 0 ||
this._enableEventPropagation) &&
this._viewer?.viewerEvent
) {
event = this._viewer.viewerEvent.getEvent(type)
event &&
event.numberOfListeners > 0 &&
event.raiseEvent({
...targetInfo,
...mouseInfo,
})
// raise event for layer
if (!handled || this._enableEventPropagation) {
handled = doRaise(layer?.layerEvent, eventParams)
} }


// get Drill Pick Event
if (overlay?.allowDrillPicking) {
let drillInfos = this._getDrillInfos(mouseInfo.windowPosition)
drillInfos.forEach((drillInfo) => {
let dillOverlay = drillInfo?.overlay
let dillLayer = drillInfo?.layer
if (
dillOverlay?.overlayId !== overlay.overlayId &&
dillOverlay?.overlayEvent
) {
// get Overlay Event
event = dillOverlay.overlayEvent.getEvent(type)
// get Layer Event
if (
(!event || event.numberOfListeners === 0) &&
dillLayer?.layerEvent
) {
event = dillLayer.layerEvent.getEvent(type)
}
event &&
event.numberOfListeners > 0 &&
event.raiseEvent({
...drillInfo,
...mouseInfo,
})
}
})
// raise event for viewer
if (!handled || this._enableEventPropagation) {
doRaise(this._viewer?.viewerEvent, eventParams)
} }
} }


? 'pointer' ? 'pointer'
: 'default' : 'default'
this._raiseEvent(MouseEventType.MOUSE_MOVE, mouseInfo) this._raiseEvent(MouseEventType.MOUSE_MOVE, mouseInfo)
// add event for overlay
if (this._enableMouseOver) { if (this._enableMouseOver) {
if ( if (
!this._selected || !this._selected ||
this._getOverlayId(this._selected.target) !==
this._getOverlayId(mouseInfo.target)
this._getTargetObject(this._selected.target).overlayId !==
this._getTargetObject(mouseInfo.target).overlayId
) { ) {
// add event for overlay
this._raiseEvent(MouseEventType.MOUSE_OUT, this._selected) this._raiseEvent(MouseEventType.MOUSE_OUT, this._selected)
this._raiseEvent(MouseEventType.MOUSE_OVER, mouseInfo) this._raiseEvent(MouseEventType.MOUSE_OVER, mouseInfo)
this._selected = mouseInfo this._selected = mouseInfo
* @private * @private
*/ */
_leftUpHandler(movement) { _leftUpHandler(movement) {
if (!movement?.position) {
return false
}
this._raiseEvent( this._raiseEvent(
MouseEventType.LEFT_UP, MouseEventType.LEFT_UP,
this._getMouseInfo(movement.position) this._getMouseInfo(movement.position)
* @private * @private
*/ */
_rightUpHandler(movement) { _rightUpHandler(movement) {
if (!movement?.position) {
return false
}
this._raiseEvent( this._raiseEvent(
MouseEventType.RIGHT_UP, MouseEventType.RIGHT_UP,
this._getMouseInfo(movement.position) this._getMouseInfo(movement.position)

+ 16
- 125
src/modules/index.js View File



export { default as Viewer } from './viewer/Viewer' export { default as Viewer } from './viewer/Viewer'


export {
MouseEventType,
SceneEventType,
TileSetEventType,
ModelEventType,
} from './event'
export * from './event'


export { MouseMode } from './option' export { MouseMode } from './option'




export { default as Parse, default as P } from './parse/Parse' export { default as Parse, default as P } from './parse/Parse'


export {
ImageryType,
ImageryLayerFactory,
CustomGeographicTilingScheme,
CustomMercatorTilingScheme,
} from './imagery'

export { TerrainType, TerrainFactory } from './terrain'

export { GroundSkyBox } from './exts'

export {
LayerType,
Layer,
LayerGroup,
ClusterLayer,
CzmlLayer,
DynamicLayer,
FeatureGridLayer,
GeoJsonLayer,
GpxLayer,
GraticuleLayer,
GroundPrimitiveLayer,
HtmlLayer,
I3SLayer,
KmlLayer,
LabelLayer,
PrimitiveLayer,
RasterTileLayer,
TilesetLayer,
VectorLayer,
} from './layer'
export * from './imagery'

export * from './terrain'

export * from './exts'

export * from './layer'


export { default as HeatMapLayer } from './heat-map/HeatMapLayer' export { default as HeatMapLayer } from './heat-map/HeatMapLayer'




export { default as ChartLayer } from './chart/ChartLayer' export { default as ChartLayer } from './chart/ChartLayer'


export {
Overlay,
OverlayType,
CustomBillboard,
CustomLabel,
DynamicBillboard,
DynamicModel,
DivIcon,
Model,
Tileset,
I3S,
AttackArrow,
DoubleArrow,
FineArrow,
GatheringPlace,
TailedAttackArrow,
BillboardPrimitive,
BounceBillboardPrimitive,
BounceLabelPrimitive,
CloudPrimitive,
DiffuseWallPrimitive,
ElecEllipsoidPrimitive,
FlowLinePrimitive,
LabelPrimitive,
LightCylinderPrimitive,
ModelPrimitive,
PointPrimitive,
PolylinePrimitive,
ScanCirclePrimitive,
TrailLinePrimitive,
VideoPrimitive,
WaterPrimitive,
Billboard,
Box,
Circle,
Corridor,
Cylinder,
Ellipse,
Sphere,
Label,
Plane,
Point,
Polygon,
Polyline,
PolylineVolume,
Rect,
Wall,
} from './overlay'

export {
CircleBlurMaterialProperty,
CircleDiffuseMaterialProperty,
CircleFadeMaterialProperty,
CirclePulseMaterialProperty,
CircleScanMaterialProperty,
CircleSpiralMaterialProperty,
CircleVaryMaterialProperty,
CircleWaveMaterialProperty,
EllipsoidElectricMaterialProperty,
EllipsoidTrailMaterialProperty,
PolylineFlickerMaterialProperty,
PolylineFlowMaterialProperty,
PolylineImageTrailMaterialProperty,
PolylineLightingMaterialProperty,
PolylineLightingTrailMaterialProperty,
PolylineTrailMaterialProperty,
RadarLineMaterialProperty,
RadarSweepMaterialProperty,
RadarWaveMaterialProperty,
WallImageTrailMaterialProperty,
WallLineTrailMaterialProperty,
WallTrailMaterialProperty,
WaterMaterialProperty,
} from './material'
export * from './overlay'

export * from './material'


export { default as Plot } from './plot/Plot' export { default as Plot } from './plot/Plot'


export {
AnimationType,
AroundPoint,
AroundView,
CircleScan,
Flying,
GlobeRotate,
RadarScan,
} from './animation'
export * from './animation'


export { default as Effect } from './effect/Effect' export { default as Effect } from './effect/Effect'


export { default as Weather } from './weather/Weather' export { default as Weather } from './weather/Weather'


export { KeyboardRoaming, RoamingController, RoamingPath } from './roaming'
export * from './roaming'


export { TrackViewMode, TrackController, Track } from './history-track'
export * from './history-track'


export { MeasureType, Measure } from './measure'
export * from './measure'


export { GeoTools } from './geo-tools'
export * from './geo-tools'

+ 1
- 0
src/modules/material/index.js View File

* radar material property * radar material property
*/ */
export { default as RadarLineMaterialProperty } from './property/radar/RadarLineMaterialProperty' export { default as RadarLineMaterialProperty } from './property/radar/RadarLineMaterialProperty'
export { default as RadarOuterMaterialProperty } from './property/radar/RadarOuterMaterialProperty'
export { default as RadarSweepMaterialProperty } from './property/radar/RadarSweepMaterialProperty' export { default as RadarSweepMaterialProperty } from './property/radar/RadarSweepMaterialProperty'
export { default as RadarWaveMaterialProperty } from './property/radar/RadarWaveMaterialProperty' export { default as RadarWaveMaterialProperty } from './property/radar/RadarWaveMaterialProperty'



+ 54
- 0
src/modules/material/property/radar/RadarOuterMaterialProperty.js View File

/**
* @Author : Caven Chen
*/

import { Cesium } from '../../../../libs'
import MaterialProperty from '../../MaterialProperty'

class RadarOuterMaterialProperty extends MaterialProperty {
constructor(options = {}) {
super(options)
this._repeat = undefined
this._repeatSubscription = undefined
this._thickness = undefined
this._thicknessSubscription = undefined
this.repeat = options.repeat || 30.0
this.thickness = options.thickness || 0.3
}

getType(time) {
return Cesium.Material.RadarOuterType
}

getValue(time, result) {
result = Cesium.defaultValue(result, {})
result.color = Cesium.Property.getValueOrUndefined(this._color, time)
result.speed = Cesium.Property.getValueOrUndefined(this._speed, time)
result.repeat = Cesium.Property.getValueOrUndefined(this._repeat, time)
result.thickness = Cesium.Property.getValueOrUndefined(
this._thickness,
time
)
return result
}

equals(other) {
return (
this === other ||
(other instanceof RadarOuterMaterialProperty &&
Cesium.Property.equals(this._color, other._color) &&
Cesium.Property.equals(this._speed, other._speed) &&
Cesium.Property.equals(this._repeat, other._repeat) &&
Cesium.Property.equals(this._thickness, other._thickness))
)
}
}

Object.defineProperties(RadarOuterMaterialProperty.prototype, {
color: Cesium.createPropertyDescriptor('color'),
repeat: Cesium.createPropertyDescriptor('repeat'),
thickness: Cesium.createPropertyDescriptor('thickness'),
speed: Cesium.createPropertyDescriptor('speed'),
})

export default RadarOuterMaterialProperty

+ 16
- 0
src/modules/material/shader/radar/RadarOuterMaterial.glsl View File

uniform vec4 color;
uniform float speed;
uniform float repeat;
uniform float thickness;
czm_material czm_getMaterial(czm_materialInput materialInput){
czm_material material = czm_getDefaultMaterial(materialInput);
float sp = 1.0 / repeat;
vec2 st = materialInput.st;
float dis = distance(st, vec2(0.5));
float t = czm_frameNumber * speed / 1000.0;
float m = mod(dis - fract(t), sp);
float a = step(sp * (1.0 - thickness), m);
material.diffuse = color.rgb;
material.alpha = a * color.a;
return material;
}

+ 22
- 0
src/modules/material/type/radar.js View File

import RadarLineMaterial from '../shader/radar/RadarLineMaterial.glsl' import RadarLineMaterial from '../shader/radar/RadarLineMaterial.glsl'
import RadarSweepMaterial from '../shader/radar/RadarSweepMaterial.glsl' import RadarSweepMaterial from '../shader/radar/RadarSweepMaterial.glsl'
import RadarWaveMaterial from '../shader/radar/RadarWaveMaterial.glsl' import RadarWaveMaterial from '../shader/radar/RadarWaveMaterial.glsl'
import RadarOuterMaterial from '../shader/radar/RadarOuterMaterial.glsl'


/** /**
* RadarLine * RadarLine
return true return true
}, },
}) })

/**
* RadarOuter
* @type {string}
*/
Cesium.Material.RadarOuterType = 'RadarOuter'
Cesium.Material._materialCache.addMaterial(Cesium.Material.RadarOuterType, {
fabric: {
type: Cesium.Material.RadarOuterType,
uniforms: {
color: new Cesium.Color(1.0, 0.0, 0.0, 0.7),
speed: 3.0,
repeat: 30.0,
thickness: 0.3,
},
source: RadarOuterMaterial,
},
translucent: function (material) {
return true
},
})

+ 0
- 2
src/modules/option/ViewerOption.js View File

if (Object.keys(options).length === 0) { if (Object.keys(options).length === 0) {
return this return this
} }

this._options = { this._options = {
...this._options, ...this._options,
...options, ...options,
} }

this._setViewerOption() this._setViewerOption()
._setCanvasOption() ._setCanvasOption()
._setSceneOption() ._setSceneOption()

+ 7
- 3
src/modules/overlay/vector/Polyline.js View File

constructor(positions) { constructor(positions) {
super() super()
this._positions = Parse.parsePositions(positions) this._positions = Parse.parsePositions(positions)
this._delegate = new Cesium.Entity({ polyline: {} })
this._delegate = new Cesium.Entity({
polyline: {
positions: new Cesium.CallbackProperty(() => {
return Transform.transformWGS84ArrayToCartesianArray(this._positions)
}, false),
},
})
this._state = State.INITIALIZED this._state = State.INITIALIZED
} }




set positions(positions) { set positions(positions) {
this._positions = Parse.parsePositions(positions) this._positions = Parse.parsePositions(positions)
this._delegate.polyline.positions =
Transform.transformWGS84ArrayToCartesianArray(this._positions)
} }


get positions() { get positions() {

+ 30
- 4
src/modules/viewer/Viewer.js View File

...DEF_OPTS, ...DEF_OPTS,
...options, ...options,
}) // Initialize the viewer }) // Initialize the viewer

this._delegate.canvas.parentNode.className = 'viewer-canvas'
this._delegate.canvas.parentNode.className = 'viewer-canvas' //re-name the default class


/** /**
* Registers events * Registers events
*/ */
new MouseEvent(this, options) // Register global mouse events
this._mouseEvent = new MouseEvent(this, options) // Register global mouse events
this._viewerEvent = new ViewerEvent() // Register viewer events this._viewerEvent = new ViewerEvent() // Register viewer events
this._sceneEvent = new SceneEvent(this) // Register scene events this._sceneEvent = new SceneEvent(this) // Register scene events

this._viewerOption = new ViewerOption(this) // Initialize the viewer option this._viewerOption = new ViewerOption(this) // Initialize the viewer option
this._cameraOption = new CameraOption(this) // Initialize the camera option this._cameraOption = new CameraOption(this) // Initialize the camera option


/**
* Registers Container
*
*/
this._widgetContainer = DomUtil.create( this._widgetContainer = DomUtil.create(
'div', 'div',
'viewer-widgets', 'viewer-widgets',
return Math.round(D + (A - D) / (1 + Math.pow(height / C, B))) return Math.round(D + (A - D) / (1 + Math.pow(height / C, B)))
} }


set enableEventPropagation(enableEventPropagation) {
this._mouseEvent.enableEventPropagation = enableEventPropagation
}

get enableEventPropagation() {
return this._mouseEvent.enableEventPropagation
}

set enableMouseOver(enableMouseOver) {
this._mouseEvent.enableMouseOver = enableMouseOver
}

get enableMouseOver() {
return this._mouseEvent.enableMouseOver
}

set enableMouseMovePick(enableMouseMovePick) {
this._mouseEvent.enableMouseMovePick = enableMouseMovePick
}

get enableMouseMovePick() {
return this._mouseEvent.enableMouseMovePick
}

/** /**
* Adds a plugin * Adds a plugin
* @param plugin * @param plugin

Write Preview
Loading…
Cancel
Save