@mapgis/webclient-video-plugin

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title> Home</title>  <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="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>视频地图视图类 <br/> 继承自<a href='http://webclient.smaryun.com/static/modules/common/api/common-mapgis/BaseView.html' target='_blank'>zondy.BaseView</a><br/> 支持MP4,HLS,RTMP视频格式。</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>视频草图编辑类<br/> 继承自<a href='http://webclient.smaryun.com/static/modules/leaflet/api/leaflet-mapgis/SketchEditor.html' target='_blank'>zondy.leaflet.SketchEditor</a><br/> <br>[ES5引入方式]：<br/> const { SketchEditor } = zondy.video.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><h3>MapGIS WebClient for Video API 文档</h3> <p>主要介绍 MapGIS WebClient for Video 的用法</p> <h2>模块划分</h2> <h4>地图库模块</h4> <p><code>地图视图</code></p> <h2>准备</h2> <h3>如何获取 MapGIS WebClient for Video</h3> <p>开发时需要引入 MapGIS WebClient for Video 相关开发包。其中包括引擎核心库以及中地的插件库<br/></p> <h4>外网</h4> <h5>es5 方式</h5> <p>请在如下网址下载引擎核心库以及中地的插件库：<br/> http://beta.smaryun.com/dev/download_detail.html#/download827</p> <h5>es6 方式</h5> <p>请通过 npm 的方式安装插件库，开发所需依赖，都在插件库中</p> <pre class="prettyprint source lang-markdown"><code>npm install @mapgis/webclient-video-plugin </code></pre> <h4>内网</h4> <h5>es5 方式</h5> <p>请在如下网址下载引擎核心库以及中地的插件库：<br/> 插件库：http://192.168.11.130:4873/-/web/detail/@mapgis/webclient-video-plugin <br/></p> <h5>es6 方式</h5> <p>请通过 npm 的方式安装插件库，开发所需依赖，都在插件库中<br/> 先将 npm 的源切换至内网<br/> npm set registry http://192.168.11.130:4873/<br/> 然后通过 npm 进行安装</p> <pre class="prettyprint source lang-markdown"><code>npm install @mapgis/webclient-video-plugin </code></pre> <h2>引入</h2> <h3>1、文件方式引入</h3> <pre class="prettyprint source lang-html"><code><!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" /> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no" />  <link rel="stylesheet" href="http://{ip}:{port}/{你的路径}/leaflet/leaflet.css" /> <script src="http://{ip}:{port}/{你的路径}/leaflet/leaflet.js"></script>  <script src="http://{ip}:{port}/{你的路径}/zondyclient/webclient-common-plugin.js"></script> <script src="http://{ip}:{port}/{你的路径}/zondyclient/webclient-leaflet-plugin.js"></script> <script src="http://{ip}:{port}/{你的路径}/zondyclient/webclient-video-plugin.js"></script>  <style> #你的场景视图的id { width: 100%; height: 100%; position: absolute; } </style> </head> </html> </code></pre> <h3>2、npm 方式引入</h3> <p>找到你项目的 index.html 或者项目的 css 中设置如下样式</p> <pre class="prettyprint source lang-css"><code>/*设置场景视图的样式，一定要设置否则地图无法显示*/ #你的场景视图的id { width: 100%; height: 100%; position: absolute; } </code></pre> <p>之后通过 npm 的方式引入插件库</p> <pre class="prettyprint source lang-markdown"><code>npm install @mapgis/webclient-video-plugin </code></pre> <p>并且在项目的 main.js 中引入 leaflet 的 css 样式</p> <pre class="prettyprint source lang-javascript"><code>import '@mapgis/leaflet/dist/leaflet.css' </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://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>