npm - @mapgis/webclient-mapboxgl-plugin - Versions diffs - 10.3.4 → 17.0.0 - Mend

@mapgis/webclient-mapboxgl-plugin 10.3.4 → 17.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (91) hide show

package/README.md +51 -124
package/dist/es5/webclient-common.min.js +90 -0
package/dist/es5/webclient-mapboxgl-plugin.min.js +1 -0
package/dist/webclient-mapboxgl-plugin-es6.min.js +1 -0
package/documention/EchartsLayer.html +379 -0
package/documention/MapViewMapboxgl.html +3587 -0
package/documention/Popup.html +1523 -0
package/documention/Screenshot.html +1089 -0
package/documention/SketchEditorMapboxgl.html +3383 -0
package/documention/document_ArcGISVectorTileLayerView.js.html +265 -0
package/documention/document_EchartsLayerView.js.html +246 -0
package/documention/document_GraphicsLayerView.js.html +314 -0
package/documention/document_IGSFeatureLayerView.js.html +218 -0
package/documention/document_IGSMapImageLayerView.js.html +240 -0
package/documention/document_IGSTileLayerView.js.html +236 -0
package/documention/document_IGSVectorTileLayerView.js.html +264 -0
package/documention/document_MapVLayerView.js.html +247 -0
package/documention/document_WMSLayerView.js.html +240 -0
package/documention/document_WMTSLayerView.js.html +234 -0
package/documention/document_WebTileLayerView.js.html +240 -0
package/documention/document_support_FeatureRenderView.js.html +682 -0
package/documention/document_support_MapboxglGraphicsLayer.js.html +1184 -0
package/documention/document_support_SourceMetaData.js.html +223 -0
package/documention/document_support_Utils.js.html +624 -0
package/documention/document_support_mapbox_mapboxCustomUtil.js.html +322 -0
package/documention/global.html +252 -0
package/documention/index.html +251 -0
package/documention/module-%E5%AE%A2%E6%88%B7%E7%AB%AF%E5%8F%AF%E8%A7%86%E5%8C%96.MapvLayer.html +445 -0
package/documention/scripts/app.min.js +1 -0
package/documention/scripts/linenumber.js +26 -0
package/documention/scripts/search.js +45 -0
package/documention/scripts/sideBar.js +11 -0
package/documention/sketchEditor_SketchEditorMapboxgl.js.html +875 -0
package/documention/styles/anchor.png +0 -0
package/documention/styles/app.min.css +1 -0
package/documention/styles/c.png +0 -0
package/documention/styles/iframe.css +29 -0
package/documention/styles/m.png +0 -0
package/documention/styles/prettify-jsdoc.css +111 -0
package/documention/styles/prettify-tomorrow.css +132 -0
package/documention/styles/reset.css +44 -0
package/documention/styles/up-arrow.png +0 -0
package/documention/tutorial-1./345/277/253/351/200/237/345/205/245/351/227/250.html +165 -0
package/documention/util_ConvertRendererToStyleLayerUtil.js.html +844 -0
package/documention/util_MapboxglFeatureRender.js.html +225 -0
package/documention/util_MapboxglPlugin.js.html +284 -0
package/documention/view_MapViewMapboxgl.js.html +1882 -0
package/documention/view_utils_ArcGISVectorTileLayerUtil.js.html +382 -0
package/documention/view_utils_EchartsLayerUtil.js.html +194 -0
package/documention/view_utils_IGSMapImageUtil.js.html +373 -0
package/documention/view_utils_IGSTileLayerUtil.js.html +285 -0
package/documention/view_utils_IGSVectorTileLayerUtil.js.html +379 -0
package/documention/view_utils_MapVLayerUtil.js.html +197 -0
package/documention/view_utils_Popup.js.html +525 -0
package/documention/view_utils_Screenshot.js.html +320 -0
package/documention/view_utils_WMSLayerUtil.js.html +337 -0
package/documention/view_utils_WMTSLayerUtil.js.html +331 -0
package/documention/view_utils_WebTileLayerUtil.js.html +284 -0
package/documention/view_utils_echarts_EchartsLayerPlugin.js.html +419 -0
package/documention/view_utils_mapV_MapVLayerPlugin.js.html +527 -0
package/documention/view_utils_mapV_MapvBaseLayer.js.html +477 -0
package/documention/view_utils_support_rasterLayerUtil.js.html +244 -0
package/documention/view_utils_support_vectorLayerUtil.js.html +503 -0
package/package.json +20 -20
package/core/Base.js +0 -15
package/core/index.js +0 -5
package/index.js +0 -6
package/overlay/D3Layer.js +0 -108
package/overlay/EchartsLayer.js +0 -242
package/overlay/ElsCubeLayer.js +0 -125
package/overlay/MapvLayer.js +0 -296
package/overlay/StreamLayer.js +0 -83
package/overlay/TimeSpaceCubeLayer.js +0 -135
package/overlay/dthree/mapbox-d3.css +0 -9
package/overlay/echarts/MapCoordSys.js +0 -105
package/overlay/echarts/MapModel.js +0 -0
package/overlay/echarts/MapView.js +0 -0
package/overlay/echarts/index.js +0 -4
package/overlay/index.js +0 -31
package/overlay/mapv/MapvBaseLayer.js +0 -299
package/overlay/mapv/index.js +0 -5
package/overlay/stream/GeojsonStreamLayer.js +0 -135
package/overlay/stream/MapvStreamLayer.js +0 -79
package/overlay/stream/index.js +0 -3
package/overlay/stream/popup.css +0 -31
package/service/index.js +0 -1
package/service/socket/ISocketService.js +0 -121
package/service/socket/SocketEvent.js +0 -50
package/service/socket/SocketService.js +0 -90
package/util/Evented.js +0 -295
package/util/Util.js +0 -348

package/documention/view_utils_mapV_MapVLayerPlugin.js.html ADDED Viewed

@@ -0,0 +1,527 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>Client for JavaScript view/utils/mapV/MapVLayerPlugin.js</title>
+  <!--[if lt IE 9]>
+    <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
+  <![endif]-->
+  <link type="text/css" rel="stylesheet" href="styles/app.min.css">
+  <link type="text/css" rel="stylesheet" href="styles/iframe.css">
+  <link type="text/css" rel="stylesheet" href="">
+</head>
+<body class="layout small-header">
+    <div id="stickyNavbarOverlay"></div>
+<div class="top-nav">
+    <div class="inner">
+        <a id="hamburger" role="button" class="navbar-burger" aria-label="menu" aria-expanded="false">
+            <span aria-hidden="true"></span>
+            <span aria-hidden="true"></span>
+            <span aria-hidden="true"></span>
+        </a>
+        <div class="logo">
+                <h1> MapGIS Client for JavaScript API</h1>
+        </div>
+        <div class="menu">
+            <div class="navigation">
+                        <a
+                            class="link user-link "
+                            href="/static/modules/common/api/common-mapgis/index.html"
+                        >
+                            Common
+                        </a>
+                        <a
+                            class="link user-link "
+                            href="/static/modules/cesium/api/cesium-mapgis/index.html"
+                        >
+                            Cesium
+                        </a>
+                        <a
+                            class="link user-link "
+                            href="/static/modules/mapboxgl/api/mapboxgl-mapgis/index.html"
+                        >
+                            MapboxGL
+                        </a>
+                        <a
+                            class="link user-link "
+                            href="/static/modules/leaflet/api/leaflet-mapgis/index.html"
+                        >
+                            Leaflet
+                        </a>
+                        <a
+                            class="link user-link "
+                            href="/static/modules/openlayers/api/openLayers-mapgis/index.html"
+                        >
+                            OpenLayers
+                        </a>
+            </div>
+        </div>
+    </div>
+</div>
+    <div id="main">
+        <div
+            class="sidebar "
+            id="sidebarNav"
+        >
+            <div>
+                <span class="mapgis-api-document-span"><a href="index.html">API文档</a></span>
+            </div>
+                <div class="search-wrapper">
+                    <input id="search" type="text" placeholder="搜索文档..." class="input">
+                </div>
+            <nav>
+                    <div class="category"><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Popup.html">Popup</a><span style="display: none;"><p>二维场景信息弹窗(leaflet引擎)
+参考示例：
+<a href='#MapView'>[初始化二维场景视图]</a>
+[ES6引入方式]：<br/>
+import { Popup } from '@mapgis/webclient-leaflet-plugin' <br/>
+自定义样式说明：<br/>
+zondy-popup__content 弹窗容器样式<br/>
+zondy-popup__tip 弹窗对话框箭头样式<br/>
+zondy-popup__header 弹窗头部样式<br/>
+zondy-popup__content 弹窗主体样式<br/>
+zondy-popup__footer 弹窗底部样式<br/></p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">undefined</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="Screenshot.html">Screenshot</a><span style="display: none;"><p>打印工具</p></span></li></ul><div style="font-weight: bold;vertical-align: middle;padding: 0.4rem 0;" class="mapgis-menu-span"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/m.png" alt="">草图编辑模块</div><ul class="mapgis-sidebar-menus"><li><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditorMapboxgl.html">SketchEditorMapboxgl</a><span style="display: none;"><p>二维场景草图编辑类<br/>
+<br>[ES5引入方式]：<br/>
+const { SketchEditorMapboxgl } = Zondy <br/>
+[ES6引入方式]：<br/>
+import { SketchEditorMapboxgl } from &quot;@mapgis/webclient-leaflet-plugin&quot; <br/></p></span></li></ul></div>
+            </nav>
+        </div>
+        <div class="core" id="main-content-wrapper">
+            <div class="content">
+                <header id="page-title" class="page-title">
+                    <span class="page-title-main">类名</span>
+                    <span class="page-title-sub">view/utils/mapV/MapVLayerPlugin.js</span>
+                </header>
+    <section>
+        <article>
+            <pre class="prettyprint source linenums"><code>import mapboxgl from '@mapgis/mapbox-gl'
+import MapvBaseLayer from './MapvBaseLayer'
+/**
+ * @origin author kyle / http://nikai.us/
+ * @author 基础平台/创新中心 潘卓然 ParnDeedlit
+ * @class module:客户端可视化.MapvLayer
+ * @classdesc 基于mapboxgl的Layer对象进行的拓展
+ * @param map - {Object} 传入的mapboxgl的地图对象
+ * @param dataset - {MapvDataSet} 传入的mapv的属性。 &lt;br>
+ * @param mapvoption - {MapvOption} 可选参数。&lt;br>
+ * @see https://github.com/huiyan-fe/mapv/blob/master/API.md
+ * @example
+ * var options = {
+      size: 13,
+      gradient: {
+        0.25: "rgb(0,0,255)",
+        0.55: "rgb(0,255,0)",
+        0.85: "yellow",
+        1.0: "rgb(255,0,0)"
+      },
+      max: 60,
+      animation: {
+        type: 'time',
+        stepsRange: {
+          start: 0,
+          end: 100
+        },
+        trails: 10,
+        duration: 4,
+      },
+      draw: 'heatmap'
+    }
+ var mapvLayer = new mapboxgl.zondy.MapvLayer(map, dataSet, options);
+ */
+class MapvLayer {
+  constructor(map, dataSet, mapVOptions) {
+    this.map = map
+    this.layerID = mapVOptions.layerID
+    delete mapVOptions['layerID']
+    this.mapvBaseLayer = new MapvBaseLayer(map, dataSet, mapVOptions, this)
+    this.mapVOptions = mapVOptions
+    this.initDevicePixelRatio()
+    this.canvas = this._createCanvas()
+    this.render = this.render.bind(this)
+    this.bindEvent()
+    this.mapContainer = map.getCanvasContainer()
+    this.mapContainer.appendChild(this.canvas)
+    // this.mapContainer.style.perspective = this.map.transform.cameraToCenterDistance + 'px';
+    this._reset()
+  }
+  initDevicePixelRatio() {
+    this.devicePixelRatio = window.devicePixelRatio || 1
+  }
+  // -----------------------------------Event Methods----------------------------------------
+  bindEvent() {
+    const map = this.map
+    // 下面几个是mapboxgl专属事件,clickEvent和mousemoveEvent是mapv内部自带的方法不放出来
+    this.innerMoveStart = this.moveStartEvent.bind(this)
+    this.innerMoveEnd = this.moveEndEvent.bind(this)
+    this.innnerZoomStart = this.zoomStartEvent.bind(this)
+    this.innnerZoomEnd = this.zoomEndEvent.bind(this)
+    this.innnerRotateStart = this.rotateStartEvent.bind(this)
+    this.innnerRotateEnd = this.rotateEndEvent.bind(this)
+    this.innerResize = this.resizeEvent.bind(this)
+    this.innerRemove = this.removeEvent.bind(this)
+    map.on('resize', this.innerResize)
+    map.on('zoomstart', this.innnerZoomStart)
+    map.on('zoomend', this.innnerZoomEnd)
+    map.on('rotatestart', this.innnerRotateStart)
+    map.on('rotateend', this.innnerRotateEnd)
+    map.on('movestart', this.innerMoveStart)
+    map.on('moveend', this.innerMoveEnd)
+    this.map.on('remove', this.innerRemove)
+  }
+  unbindEvent() {
+    const map = this.map
+    map.off('resize', this.innerResize)
+    map.off('zoomstart', this.innnerZoomStart)
+    map.off('zoomend', this.innnerZoomEnd)
+    map.off('rotatestart', this.innnerRotateStart)
+    map.off('rotateend', this.innnerRotateEnd)
+    map.off('movestart', this.innerMoveStart)
+    map.off('moveend', this.innerMoveEnd)
+  }
+  moveStartEvent() {
+    this.mapvBaseLayer.animatorMovestartEvent()
+    this._unvisiable()
+  }
+  moveEndEvent() {
+    this.mapvBaseLayer.animatorMoveendEvent()
+    this._reset()
+    this._visiable()
+  }
+  zoomStartEvent() {
+    this._unvisiable()
+  }
+  zoomEndEvent() {
+    this._unvisiable()
+  }
+  rotateStartEvent() {
+    this.mapvBaseLayer.animatorMovestartEvent()
+    this._unvisiable()
+  }
+  rotateEndEvent() {
+    this.mapvBaseLayer.animatorMoveendEvent()
+    this._reset()
+    this._visiable()
+  }
+  resizeEvent() {
+    this._reset()
+    this._visiable()
+  }
+  removeEvent() {
+    this.mapContainer.removeChild(this.canvas)
+  }
+  // -----------------------------------Event Methods----------------------------------------
+  // -----------------------------------Start Data Operation---------------------------------
+  /**
+   * 增加数据
+   * @function mapboxgl.zondy.MapvLayer.prototype.addData
+   *
+   * @param data - {Array} 数据.
+   * @param options - {Object} 只做额外增加的字段作用
+   */
+  addData(data, options) {
+    this.mapvBaseLayer.addData(data, options)
+  }
+  /**
+   * 更新数据
+   * @function mapboxgl.zondy.MapvLayer.prototype.updateData
+   *
+   * @param data - {Array} 数据.
+   * @param options - {Object} 只做额外增加的字段作用
+   */
+  updateData(data, options) {
+    this.mapvBaseLayer.updateData(data, options)
+  }
+  getData() {
+    if (this.mapvBaseLayer) {
+      this.dataSet = this.mapvBaseLayer.getData()
+    }
+    return this.dataSet
+  }
+  /**
+   * @function mapboxgl.zondy.MapvLayer.prototype.removeData
+   * @param filter - {Function} 过滤函数，返回true的保留
+   * @description 移除满足过滤条件的数据
+   * @example
+   * filter: function(item){
+            if (item.count > 10 &amp;&amp; item.count &lt; 50) {
+                return true;
+            } else {
+                return false;
+            }
+        }
+   */
+  removeData(filter) {
+    this.mapvBaseLayer &amp;&amp; this.mapvBaseLayer.removeData(filter)
+  }
+  /**
+   * @function mapboxgl.zondy.MapvLayer.prototype.removeAllData
+   * @description 移除全部数据
+   */
+  removeAllData() {
+    this.mapvBaseLayer.clearData()
+  }
+  // -----------------------------------End Data Operation---------------------------------
+  _visiable() {
+    this.canvas.style.display = 'block'
+    return this
+  }
+  _unvisiable() {
+    this.canvas.style.display = 'none'
+    return this
+  }
+  _createCanvas() {
+    const canvas = document.createElement('canvas')
+    const devicePixelRatio = this.devicePixelRatio
+    canvas.id = this.layerID
+    canvas.style.position = 'absolute'
+    canvas.style.top = '0px'
+    canvas.style.left = '0px'
+    canvas.width = parseInt(this.map.getCanvas().style.width) * devicePixelRatio
+    canvas.height =
+      parseInt(this.map.getCanvas().style.height) * devicePixelRatio
+    if (!this.mapVOptions.context || this.mapVOptions.context == '2d') {
+      canvas.getContext('2d').scale(devicePixelRatio, devicePixelRatio)
+    }
+    canvas.style.width = this.map.getCanvas().style.width
+    canvas.style.height = this.map.getCanvas().style.height
+    return canvas
+  }
+  _reset() {
+    if (this.canvas == null) {
+      return
+    }
+    this.resizeCanvas()
+    this.fixPosition()
+    this.onResize()
+    this.render()
+  }
+  draw() {
+    return this._reset()
+  }
+  /**
+   * 显示图层
+   * @function mapboxgl.zondy.MapvLayer.prototype.show
+   */
+  show() {
+    this._visiable()
+  }
+  /**
+   * 隐藏图层
+   * @function mapboxgl.zondy.MapvLayer.prototype.hide
+   */
+  hide() {
+    this._unvisiable()
+  }
+  /**
+   * 更新图层
+   * @function mapboxgl.zondy.MapvLayer.prototype.update
+   * @param opt.data - {Array} 需要更新的数据
+   * @param opt.options - {Object} 需要更新的样式
+   */
+  update(opt) {
+    if (opt == undefined) {
+      return
+    }
+    this.updateData(opt.data, opt.options)
+  }
+  resizeCanvas() {
+    this.mapContainer.style.perspective = `${this.map.transform.cameraToCenterDistance}px`
+    if (this.canvas == undefined || this.canvas == null) return
+    const canvas = this.canvas
+    const devicePixelRatio = this.devicePixelRatio
+    canvas.style.position = 'absolute'
+    canvas.style.top = '0px'
+    canvas.style.left = '0px'
+    canvas.width = parseInt(this.map.getCanvas().style.width) * devicePixelRatio
+    canvas.height =
+      parseInt(this.map.getCanvas().style.height) * devicePixelRatio
+    // canvas.style.width = this.map.getCanvas().style.width;
+    // canvas.style.height = this.map.getCanvas().style.height;
+    if (!this.mapVOptions.context || this.mapVOptions.context == '2d') {
+      canvas.getContext('2d').scale(devicePixelRatio, devicePixelRatio)
+    }
+  }
+  fixPosition() {}
+  onResize() {}
+  originPosition() {
+    this.originPitch = this.map.getPitch()
+    this.originBearing = this.map.getBearing()
+    const origin = this.map.project(new mapboxgl.LngLat(0, 0))
+    this.originX = origin.x
+    this.originY = origin.y
+  }
+  render() {
+    if (this.mapvBaseLayer == undefined) return
+    this.mapvBaseLayer._canvasUpdate()
+  }
+  moveTo(layerID, before) {
+    const layer = document.getElementById(this.layerID)
+    before = before !== undefined ? before : true
+    if (before) {
+      const beforeLayer = document.getElementById(layerID)
+      if (layer &amp;&amp; beforeLayer) {
+        beforeLayer.parentNode.insertBefore(layer, beforeLayer)
+      }
+      return
+    }
+    const nextLayer = document.getElementById(layerID)
+    if (layer) {
+      if (nextLayer.nextSibling) {
+        nextLayer.parentNode.insertBefore(layer, nextLayer.nextSibling)
+        return
+      }
+      nextLayer.parentNode.appendChild(layer)
+    }
+  }
+  /**
+   * 移除图层，清空所有的事件与数据，与destroy效果一致，保持接口与mapboxgl本身一致
+   * @function mapboxgl.zondy.MapvLayer.prototype.remove
+   */
+  remove() {
+    this.removeAllData()
+    this.unbindEvent()
+    this.mapContainer.removeChild(this.canvas)
+    this.disposeFlag = true
+  }
+  /**
+   * 销毁图层，清空所有的事件与数据，与remove效果一致
+   * @function mapboxgl.zondy.MapvLayer.prototype.destroy
+   */
+  destroy() {
+    this.removeAllData()
+    this.unbindEvent()
+    this.mapContainer.removeChild(this.canvas)
+    this.disposeFlag = true
+  }
+}
+export default MapvLayer
+</code></pre>
+        </article>
+    </section>
+            </div>
+            <footer class="footer">
+                <div class="content has-text-centered">
+                    <p>文档生成<a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.11</a></p>
+                    <p class="sidebar-created-by">
+                        <a href="http://www.smaryun.com" target="_blank">司马云</a> <span>© 2023 云生态圈</span>
+                        <a href="http://192.168.82.89:8086/#/index" target="_blank">MapGIS Client for JavaScript</a>
+                    </p>
+                </div>
+            </footer>
+        </div>
+        <div id="side-nav" class="side-nav">
+            <div style="margin-bottom: 10px;">
+                <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#page-title">构造函数</a>
+            </div>
+            <div style="margin-bottom: 10px;">
+                <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#member">成员变量</a>
+            </div>
+            <div style="margin-bottom: 10px;">
+                <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#function">方法</a>
+            </div>
+            <div>
+                <img style="vertical-align: middle;margin-right: 10px;width: 30px;" src="./styles/anchor.png"/><a href="#event">事件</a>
+            </div>
+        </div>
+    </div>
+<script src="scripts/linenumber.js"> </script>
+<script src="scripts/search.js"> </script>
+</body>
+</html>