ソースを参照

improve the mouse event

pull/218/head
chenjing 1ヶ月前
コミット
4cc8d7f71c

+ 8
- 0
examples/list.js ファイルの表示

@@ -391,6 +391,10 @@ const EXAMPLE_LIST = [
name: '波纹雷达',
page: 'radar_wave.html',
},
{
name: '雷达脉冲',
page: 'radar_outer.html',
},
{
name: '墙',
page: 'wall.html',
@@ -523,6 +527,10 @@ const EXAMPLE_LIST = [
name: '3dtiles-osgb',
page: '3dtiles_osgb.html',
},
{
name: '3dtiles-3dgs',
page: '3dtiles_3dgs.html',
},
{
name: '3dtiles-shp',
page: '3dtiles_shp.html',

+ 32
- 0
examples/model/3dtiles_3dgs.html ファイルの表示

@@ -0,0 +1,32 @@
<!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 ファイルの表示

@@ -0,0 +1,52 @@
<!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 ファイルの表示

@@ -14,8 +14,8 @@

<div id="viewer-container" class="viewer-container"></div>
<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,{
style:'img',
crs:'WGS84',
@@ -30,9 +30,7 @@
material: DC.Color.RED,
outline: true
})
layer.addOverlay(wall)
viewer.flyTo(layer)

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

+ 1
- 1
package.json ファイルの表示

@@ -64,7 +64,7 @@
"dist"
],
"dependencies": {
"cesium": "^1.132.0",
"cesium": "^1.133.1",
"supercluster": "^8.0.1"
}
}

+ 10
- 25
src/modules/event/EventType.js ファイルの表示

@@ -9,7 +9,7 @@ const BaseEventType = {
REMOVE: 'remove',
}

const MouseEventType = {
const BaseMouseEventType = {
LEFT_DOWN: Cesium.ScreenSpaceEventType.LEFT_DOWN,
LEFT_UP: Cesium.ScreenSpaceEventType.LEFT_UP,
CLICK: Cesium.ScreenSpaceEventType.LEFT_CLICK,
@@ -17,6 +17,10 @@ const MouseEventType = {
RIGHT_UP: Cesium.ScreenSpaceEventType.RIGHT_UP,
RIGHT_CLICK: Cesium.ScreenSpaceEventType.RIGHT_CLICK,
DB_CLICK: Cesium.ScreenSpaceEventType.LEFT_DOUBLE_CLICK,
}

const MouseEventType = {
...BaseMouseEventType,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
WHEEL: Cesium.ScreenSpaceEventType.WHEEL,
MOUSE_OVER: 'mouseover',
@@ -24,19 +28,13 @@ const MouseEventType = {
}

const ViewerEventType = {
...BaseMouseEventType,
MOUSE_MOVE: Cesium.ScreenSpaceEventType.MOUSE_MOVE,
WHEEL: Cesium.ScreenSpaceEventType.WHEEL,
ADD_LAYER: 'addLayer',
REMOVE_LAYER: 'removeLayer',
ADD_EFFECT: 'addEffect',
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 = {
@@ -53,14 +51,7 @@ const SceneEventType = {

const OverlayEventType = {
...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_OUT: 'mouseout',
POSITION_UPDATE: 'positionUpdate',
@@ -85,13 +76,7 @@ const LayerGroupEventType = BaseEventType

const LayerEventType = {
...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 = {

+ 135
- 184
src/modules/event/type/MouseEvent.js ファイルの表示

@@ -21,6 +21,30 @@ class MouseEvent extends Event {
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
@@ -68,56 +92,55 @@ class MouseEvent extends Event {

/**
*
* @param {*} position
* @param {*} windowPosition
* @returns
*/
_getMousePosition(position) {
_getMousePosition(windowPosition) {
let scene = this._viewer.scene
let cartesian = undefined
let surfaceCartesian = undefined
let position = undefined
let wgs84Position = undefined
let surfacePosition = 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)
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 (
scene.mode === Cesium.SceneMode.SCENE3D &&
!(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 {
surfaceCartesian = scene.camera.pickEllipsoid(
position,
surfacePosition = scene.camera.pickEllipsoid(
windowPosition,
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 {
windowPosition: position,
position: cartesian,
wgs84Position: wgs84Position,
surfacePosition: surfaceCartesian,
wgs84SurfacePosition: wgs84SurfacePosition,
windowPosition,
position,
wgs84Position,
surfacePosition,
wgs84SurfacePosition,
}
}

@@ -137,52 +160,49 @@ class MouseEvent extends Event {

/**
* Gets the drill pick overlays for the mouse event
* @param position
* @returns {[]}
* @param windowPosition
* @param exclude
* @returns {*[]}
* @private
*/
_getDrillInfos(position) {
_getDrillInfos(windowPosition, exclude) {
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 the Overlay id
*
* @param target
* @returns {any}
* @returns {{overlayId: (function(): Overlay._id)|*, layerId: (function(): Layer._id)|string|*, object: undefined, feature: undefined}}
* @private
*/
_getOverlayId(target) {
let overlayId = undefined

// for Entity
_getTargetObject(target) {
let feature = null
let object = null
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
}

/**
@@ -192,57 +212,19 @@ class MouseEvent extends Event {
* @private
*/
_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 {
layer: layer,
overlay: overlay,
@@ -258,79 +240,42 @@ class MouseEvent extends Event {
* @private
*/
_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)
}
}

@@ -398,13 +343,13 @@ class MouseEvent extends Event {
? 'pointer'
: 'default'
this._raiseEvent(MouseEventType.MOUSE_MOVE, mouseInfo)
// add event for overlay
if (this._enableMouseOver) {
if (
!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_OVER, mouseInfo)
this._selected = mouseInfo
@@ -439,6 +384,9 @@ class MouseEvent extends Event {
* @private
*/
_leftUpHandler(movement) {
if (!movement?.position) {
return false
}
this._raiseEvent(
MouseEventType.LEFT_UP,
this._getMouseInfo(movement.position)
@@ -466,6 +414,9 @@ class MouseEvent extends Event {
* @private
*/
_rightUpHandler(movement) {
if (!movement?.position) {
return false
}
this._raiseEvent(
MouseEventType.RIGHT_UP,
this._getMouseInfo(movement.position)

+ 16
- 125
src/modules/index.js ファイルの表示

@@ -4,12 +4,7 @@

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

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

export { MouseMode } from './option'

@@ -21,38 +16,13 @@ export { Transform, Transform as T, CoordTransform } from './transform'

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'

@@ -60,101 +30,22 @@ export { default as WindLayer } from './wind/WindLayer'

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 {
AnimationType,
AroundPoint,
AroundView,
CircleScan,
Flying,
GlobeRotate,
RadarScan,
} from './animation'
export * from './animation'

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

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 ファイルの表示

@@ -46,6 +46,7 @@ export { default as PolylineTrailMaterialProperty } from './property/polyline/Po
* radar material property
*/
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 RadarWaveMaterialProperty } from './property/radar/RadarWaveMaterialProperty'


+ 54
- 0
src/modules/material/property/radar/RadarOuterMaterialProperty.js ファイルの表示

@@ -0,0 +1,54 @@
/**
* @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 ファイルの表示

@@ -0,0 +1,16 @@
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 ファイルの表示

@@ -6,6 +6,7 @@ import { Cesium } from '../../../libs'
import RadarLineMaterial from '../shader/radar/RadarLineMaterial.glsl'
import RadarSweepMaterial from '../shader/radar/RadarSweepMaterial.glsl'
import RadarWaveMaterial from '../shader/radar/RadarWaveMaterial.glsl'
import RadarOuterMaterial from '../shader/radar/RadarOuterMaterial.glsl'

/**
* RadarLine
@@ -63,3 +64,24 @@ Cesium.Material._materialCache.addMaterial(Cesium.Material.RadarWaveType, {
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 ファイルの表示

@@ -172,12 +172,10 @@ class ViewerOption {
if (Object.keys(options).length === 0) {
return this
}

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

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

+ 7
- 3
src/modules/overlay/vector/Polyline.js ファイルの表示

@@ -14,7 +14,13 @@ class Polyline extends Overlay {
constructor(positions) {
super()
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
}

@@ -24,8 +30,6 @@ class Polyline extends Overlay {

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

get positions() {

+ 30
- 4
src/modules/viewer/Viewer.js ファイルの表示

@@ -52,19 +52,21 @@ class Viewer {
...DEF_OPTS,
...options,
}) // Initialize the viewer

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

/**
* 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._sceneEvent = new SceneEvent(this) // Register scene events

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

/**
* Registers Container
*
*/
this._widgetContainer = DomUtil.create(
'div',
'viewer-widgets',
@@ -216,6 +218,30 @@ class Viewer {
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
* @param plugin

読み込み中…
キャンセル
保存