@mapgis/webclient-mapboxgl-plugin
Version:
A cloud GIS network client development platform based on MapboxGL.
250 lines (190 loc) • 11.4 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Client for JavaScript Home</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-Plugin
</a>
<a
class="link user-link "
href="/static/modules/mapboxgl/api/mapboxgl-mapgis/index.html"
>
MapboxGL-Plugin
</a>
<a
class="link user-link "
href="/static/modules/leaflet/api/leaflet-mapgis/index.html"
>
Leaflet-Plugin
</a>
<a
class="link user-link "
href="/static/modules/openlayers/api/openLayers-mapgis/index.html"
>
OpenLayers-Plugin
</a>
<a
class="link user-link "
href="/static/modules/video/api/video-mapgis/index.html"
>
Video-Plugin
</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="">扩展模块</div><ul class="mapgis-sidebar-menus"><li style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title="initializeOptions"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="initializeOptions.html">initializeOptions</a><span style="display: none;"><p>根据图层获取对应的mapboxgl内的sources和layers</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 style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title="MapView"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="MapView.html">MapView</a><span style="display: none;"><p>二维场景视图(mapboxgl引擎),对地图引擎进行管理,如果要对地图图层进行管理请参考<code>Map</code>,<br/>
继承自<a href='http://webclient.smaryun.com/static/modules/common/api/common-mapgis/MapView.html' target='_blank'>zondy.MapView</a><br/>
参考示例:
<a href='#MapView'>[初始化二维场景视图]</a>
<br>[ES5引入方式]:<br/>
zondy.mapboxgl.MapView() <br/>
[ES6引入方式]:<br/>
import { MapView } from '@mapgis/webclient-mapboxgl-plugin' <br/></p></span></li><li style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title="Popup"><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>二维场景信息弹窗(mapboxgl引擎)
参考示例:
<a href='#MapView'>[初始化二维场景视图]</a>
[ES6引入方式]:<br/>
import { Popup } from '@mapgis/webclient-mapboxgl-plugin' <br/>
自定义样式说明:<br/>
zondy-popup__container 弹窗容器样式<br/>
zondy-popup__tip 弹窗对话框箭头样式<br/>
zondy-popup__header 弹窗头部样式<br/>
zondy-popup__content 弹窗主体样式<br/>
zondy-popup__footer 弹窗底部样式<br/></p></span></li><li style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title="Screenshot"><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 style="white-space: nowrap;overflow: hidden;text-overflow: ellipsis;" title="SketchEditor"><img style="width: 20px;margin-right: 6px;vertical-align: middle;" src="./styles/c.png" alt=""><a href="SketchEditor.html">SketchEditor</a><span style="display: none;"><p>二维Mapboxgl引擎草图编辑类<br/>
继承自<a href='http://webclient.smaryun.com/static/modules/common/api/common-mapgis/SketchEditor.html' target='_blank'>zondy.SketchEditor</a><br/>
<br>[ES5引入方式]:<br/>
const { SketchEditor } = zondy.mapboxgl.tool.sketch <br/>
[ES6引入方式]:<br/>
import { SketchEditor } from "@mapgis/webclient-leaflet-plugin" <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">Home</span>
</header>
<h3> </h3>
<section>
<article><br>
<h3>MapGIS WebClient for MapboxGL API</h3>
<blockquote>
<p>Mapbox GL主要是<code>构建世界上最漂亮的地图</code>,因此核心功能就是一个<code>看</code>字.</p>
</blockquote>
<h4>MapboxGL 优点</h4>
<blockquote>
<p>MapboxGL是最适合常规gis开发的地图,因此核心功能就是<code>传统GIS</code>功能.</p>
</blockquote>
<ol>
<li><code>高效矢量瓦片</code>-真正高效实用的矢量瓦片</li>
<li>顶级可视化-真正<code>顶级的可视化渲染</code>,mapboxGL,echartGL,KeplerGl等。</li>
<li><code>高清矢量图形</code>- 真正顶级的高清矢量图形绘制SVG,Canvas.</li>
<li>Top级互联网技术加持 - 国内Baidu,国外Uber,Mapbox等顶级可视化巨头技术加持.</li>
</ol>
<ul>
<li>
<p>官网(website):<a href="http://192.168.82.89:8086/#/index">http://192.168.82.89:8086/#/index</a></p>
</li>
<li>
<p>源码(source code):<a href="https://github.com/ParnDeedlit/WebClient-mapboxgl">https://github.com/ParnDeedlit/WebClient-MapboxGL</a></p>
</li>
</ul>
<h4>IGServer</h4>
<blockquote>
<p>igserver的Object,Catalog,Service的对象的分类与封装</p>
<p><a href="Zondy.Object.Feature.html">Zondy.Object.Feature</a><br>
<a href="Zondy.Catalog.MapDoc.html">Zondy.Catalog.MapDoc</a><br>
<a href="Zondy.Service.GetDocImageService.html">Zondy.Service.GetDocImageService</a><br></p>
</blockquote>
<h4>DataStore</h4>
<blockquote>
<p>ElasticSearch的时空聚类效果</p>
<p><a href="mapboxgl.zondy.GeoHashService.html">mapboxgl.zondy.GeoHashService</a><br></p>
</blockquote>
<h4>D3,Echarts,MapV</h4>
<blockquote>
<p>丰富的可视化效果,矢量瓦片、客户端专题图、开源可视化库<a href="http://echarts.baidu.com/">ECharts</a>,<a href="http://mapv.baidu.com/">MapV</a></p>
<p><a href="mapboxgl.zondy.EchartsLayer.html">mapboxgl.zondy.EchartsLayer</a><br>
<a href="mapboxgl.zondy.MapvLayer.html">mapboxgl.zondy.MapvLayer</a><br></p>
</blockquote>
<h4>参考API</h4>
<ul>
<li>Mapbox GL API:<a href="https://www.mapbox.com/mapbox-gl-js/api/">https://www.mapbox.com/mapbox-gl-js/api/</a></li>
<li>ECharts API:<a href="http://echarts.baidu.com/api.html#echarts">http://echarts.baidu.com/api.html#echarts</a></li>
<li>MapV API: <a href="https://github.com/huiyan-fe/mapv/blob/master/API.md">https://github.com/huiyan-fe/mapv/blob/master/API.md</a></li>
</ul></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://webclient.smaryun.com: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>