update dependencies

.eslintrc

@@ -29,6 +29,8 @@
     "no-trailing-spaces": 0,
     "no-mixed-spaces-and-tabs": 0,
     "space-before-function-paren": [0, "always"],
-    "no-multiple-empty-lines": 0
+    "no-multiple-empty-lines": 0,
+    "no-prototype-builtins": 0,
+    "no-loss-of-precision":0
   }
 }

README.md

@@ -1,3 +1,5 @@
+# DC-SDK
+
 <p>
 <img src="https://img.shields.io/github/actions/workflow/status/dvgis/dc-sdk/build.yml"/>
 <img src="https://img.shields.io/badge/license-Apache%202-blue"/>

gulpfile.js

@@ -19,6 +19,8 @@ import javascriptObfuscator from 'gulp-javascript-obfuscator'
 import { babel } from '@rollup/plugin-babel'
 import startServer from './server.js'
 import { uglify } from 'rollup-plugin-uglify'
+import inlineImage from 'esbuild-plugin-inline-image'
+import { glsl } from 'esbuild-plugin-glsl'
 
 const obfuscatorConfig = {
   compact: true, //压缩代码
@@ -44,6 +46,12 @@ const buildConfig = {
   sourcemap: false,
   write: true,
   logLevel: 'info',
+  plugins: [
+    inlineImage({
+      limit: -1,
+    }),
+    glsl(),
+  ],
 }
 
 const packageJson = fse.readJsonSync('./package.json')
@@ -59,7 +67,7 @@ function getTime() {
 
 async function buildNamespace(options) {
   const bundle = await rollup({
-    input: 'src/namespace.js',
+    input: 'src/namespace/libs.js',
     plugins: [
       commonjs(),
       resolve({ preferBuiltins: true }),
@@ -136,8 +144,7 @@ async function buildModules(options) {
 
   const exportNamespace = `
         export const __namespace = {
-            Cesium: exports.Cesium,
-            turf:  exports.turf
+            Cesium: exports.Cesium
         }
      `
 

package.json

@@ -40,6 +40,8 @@
     "@turf/turf": "^6.5.0",
     "chalk": "^5.2.0",
     "esbuild": "^0.17.18",
+    "esbuild-plugin-glsl": "^1.2.1",
+    "esbuild-plugin-inline-image": "^0.0.9",
     "eslint": "^8.40.0",
     "eslint-config-prettier": "^8.8.0",
     "eslint-plugin-import": "^2.27.5",

src/index.js

@@ -1,7 +1,7 @@
 /**
  @Author: Caven Chen
  **/
-import { registerLib } from './global-api/lib-utils.js'
+import { getLib, registerLib } from './global-api/lib-utils.js'
 
 export { registerLib, getLib } from './global-api/lib-utils.js'
 
@@ -24,24 +24,56 @@ export const config = {
 }
 
 export function ready(options = {}) {
-  if (options.baseUrl) {
-    this.config.baseUrl = options.baseUrl
+  if (options['baseUrl']) {
+    this.config.baseUrl = options['baseUrl']
   }
-  if (options.accessToken) {
-    this.config.accessToken = options.accessToken
+  if (options['accessToken']) {
+    this.config.accessToken = options['accessToken']
   }
-  const { Cesium, turf } = this['__namespace']
-  registerLib('Cesium', Cesium)
-  registerLib('turf', turf)
+
+  if (options['Cesium']) {
+    registerLib('Cesium', options['Cesium'])
+  } else {
+    registerLib('Cesium', this['__namespace']['Cesium'])
+  }
+
+  // if (options['echarts']) {
+  //   registerLib('echarts', options['echarts'])
+  // }
+
+  // if (options['turf']) {
+  //   registerLib('turf', options['turf'])
+  // }
+
   this['__cmdOut'] && this['__cmdOut']()
+
   return new Promise((resolve, reject) => {
+    const Cesium = getLib('Cesium')
+    if (!Cesium) {
+      throw new Error('missing Cesium Lib')
+    }
+    this.config.baseUrl && Cesium.buildModuleUrl.setBaseUrl(this.config.baseUrl)
+    // register common modules
     const modules = require('./modules')
-    this.config.baseUrl &&
-      Cesium &&
-      Cesium.buildModuleUrl.setBaseUrl(this.config.baseUrl)
     Object.keys(modules).forEach((key) => {
       this[key] = modules[key]
     })
+
+    // register chart module
+    if (getLib('echarts')) {
+      const modules = require('./modules/chart')
+      Object.keys(modules).forEach((key) => {
+        this[key] = modules[key]
+      })
+    }
+
+    // register turf module
+    if (getLib('turf')) {
+      // todo
+    }
+
     resolve()
+  }).catch((e) => {
+    throw new Error(e.message)
   })
 }

src/modules/chart/ChartLayer.js

@@ -0,0 +1,76 @@
+/**
+ @author : Caven Chen
+ @date : 2023-05-23
+ */
+
+import { echarts } from '../../namespace'
+import { Layer } from '../layer'
+const { init } = echarts
+
+class ChartLayer extends Layer {
+  constructor(id, viewer) {
+    super(id)
+    this._viewer.canvas.setAttribute('tabIndex', '0')
+    this._chartEl = this._createChartElement()
+    this._chart = init(this._chartEl)
+    this._show = true
+    Object(this._chart.getZr()).viewer = viewer
+  }
+
+  get id() {
+    return this._id
+  }
+
+  set show(show) {
+    this._show = show
+    this._chartEl.style.visibility = show ? 'visible' : 'hidden'
+  }
+
+  get show() {
+    return this._show
+  }
+
+  /**
+   *
+   * @returns {HTMLDivElement}
+   * @private
+   */
+  _createChartElement() {
+    let canvas = this._viewer.scene.canvas
+    let el = document.createElement('div')
+    el.setAttribute('id', this._id)
+    el.style.cssText = `position:absolute; top:0; left:0; width: ${canvas.clientWidth}px; height: ${canvas.clientHeight}px;pointer-events:none;`
+    this._viewer.container.appendChild(el)
+    return el
+  }
+
+  /**
+   *
+   * @param option
+   * @returns {ChartLayer}
+   */
+  setOption(option = {}) {
+    this._chart.setOption({ ...option, GLMap: {}, animation: false })
+    return this
+  }
+
+  /**
+   *
+   * @returns {ChartLayer}
+   */
+  clear() {
+    this._chart.clear()
+    return this
+  }
+
+  /**
+   *
+   * @returns {ChartLayer}
+   */
+  resize() {
+    this._chart.resize()
+    return this
+  }
+}
+
+export default ChartLayer

src/modules/chart/GLMapCoordSys.js

@@ -0,0 +1,84 @@
+/**
+ @author : Caven Chen
+ @date : 2023-05-23
+ */
+
+import { echarts, Cesium } from '../../namespace'
+const { Cartesian3, Ellipsoid, Math: CesiumMath } = Cesium
+const { graphic, matrix } = echarts
+
+class GLMapCoordSys {
+  constructor(api) {
+    this._api = api
+    this._viewer = Object(api.getZr()).viewer
+    this._mapOffset = [0, 0]
+    this.dimensions = ['lng', 'lat']
+  }
+
+  getViewer() {
+    return this._viewer
+  }
+
+  setMapOffset(mapOffset) {
+    this._mapOffset = mapOffset
+    return this
+  }
+
+  dataToPoint(data) {
+    let result = []
+    let cartesian3 = Cartesian3.fromDegrees(data[0], data[1])
+    if (!cartesian3) {
+      return result
+    }
+    let up = Ellipsoid.WGS84.geodeticSurfaceNormal(cartesian3, new Cartesian3())
+    let cd = this._viewer.camera.direction
+    if (Cartesian3.dot(up, cd) >= 0) {
+      return result
+    }
+    let coords = this._viewer.scene.cartesianToCanvasCoordinates(cartesian3)
+    if (!coords) {
+      return result
+    }
+    return [coords.x - this._mapOffset[0], coords.y - this._mapOffset[1]]
+  }
+
+  pointToData(point) {
+    let ellipsoid = this._viewer.scene.globe.ellipsoid
+    let cartesian3 = new Cartesian3(
+      point[0] + this._mapOffset[0],
+      point[1] + this._mapOffset[1],
+      0
+    )
+    let cartographic = ellipsoid.cartesianToCartographic(cartesian3)
+    return [
+      CesiumMath.toDegrees(cartographic.longitude),
+      CesiumMath.toDegrees(cartographic.latitude),
+    ]
+  }
+
+  getViewRect() {
+    let api = this._api
+    return new graphic.BoundingRect(0, 0, api.getWidth(), api.getHeight())
+  }
+
+  getRoamTransform() {
+    return matrix.create()
+  }
+
+  static create(ecModel, api) {
+    let coordinateSys = undefined
+    ecModel.eachComponent('GLMap', function (model) {
+      coordinateSys = new GLMapCoordSys(api)
+      coordinateSys.setMapOffset(model['__mapOffset'] || [0, 0])
+      model.coordinateSystem = coordinateSys
+    })
+    ecModel.eachSeries(function (model) {
+      'GLMap' === model.get('coordinateSystem') &&
+        (model.coordinateSystem = coordinateSys)
+    })
+  }
+}
+
+GLMapCoordSys.dimensions = ['lng', 'lat']
+
+export default GLMapCoordSys

src/modules/chart/GLMapModel.js

@@ -0,0 +1,18 @@
+/**
+ @author : Caven Chen
+ @date : 2023-05-23
+ */
+
+import { echarts } from '../../namespace'
+
+const { extendComponentModel } = echarts
+
+extendComponentModel({
+  type: 'GLMap',
+  getViewer() {
+    return Object(this.getZr()).viewer
+  },
+  defaultOption: {
+    roam: false,
+  },
+})

src/modules/chart/GLMapView.js

@@ -0,0 +1,26 @@
+/**
+  @Author: Caven Chen
+**/
+
+import { echarts } from '../../namespace'
+
+const { extendComponentView } = echarts
+
+extendComponentView({
+  type: 'GLMap',
+  init: function (ecModel, api) {
+    this.api = api
+    let viewer = api.getZr().viewer
+    viewer.scene.postRender.addEventListener(this.moveHandler, this)
+  },
+  moveHandler: function (t, e) {
+    this.api.dispatchAction({
+      type: 'GLMapRoam',
+    })
+  },
+  render: function (t, e, i) {},
+  dispose: function (t) {
+    let viewer = this.api.getZr().viewer
+    viewer.scene.postRender.removeEventListener(this.moveHandler, this)
+  },
+})

src/modules/chart/index.js

@@ -0,0 +1,24 @@
+/**
+  @Author: Caven Chen
+**/
+
+import { echarts } from '../../namespace'
+
+import './GLMapModel'
+import './GLMapView'
+import GLMapCoordSys from './GLMapCoordSys'
+import ChartLayer from './ChartLayer.js'
+
+const { registerAction, registerCoordinateSystem } = echarts
+
+registerCoordinateSystem('GLMap', GLMapCoordSys)
+registerAction(
+  {
+    type: 'GLMapRoam',
+    event: 'GLMapRoam',
+    update: 'updateLayout',
+  },
+  function (payload, ecModel) {}
+)
+
+export { ChartLayer }