| FazBrowse GitHub Viewer | Trending | | Home |
| Tools: [Download Repo ZIP] [Original HTTPS Page] |
1 parent ee89a6a commit 183f6ee
7 files changed
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -1,50 +1,51 @@ | |||
| 1 | - # MapGIS Client for Javascript | ||
| 1 | + # MapGIS Client for JavaScript | ||
| 2 | 2 | ||
| 3 | 3 | [![npm version][npm-img]][npm-url] | |
| 4 | 4 | [](https://github.com/MapGIS/WebClient-JavaScript/blob/master/LICENSE) | |
| 5 | 5 | ||
| 6 | 6 | [npm-img]: https://img.shields.io/badge/npm-10.5.0-brightgreen | |
| 7 | 7 | [npm-url]: https://www.npmjs.com/package/@mapgis/webclient | |
| 8 | 8 | ||
| 9 | - MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openlayers、Leaflet、MapBox、Cesium,等框架ECharts、MapV、D3等可视化库,在传统WebGIS开发基础之上,增强大数据、实时流数据的高效可视化表达和分析,为用户带来全新开发体验。 | ||
| 9 | + MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openlayers、Leaflet、MapBox、Cesium等框架,ECharts、MapV、D3等可视化库,在传统WebGIS开发基础之上,增强大数据、实时流数据的高效可视化表达和分析,为用户带来全新开发体验。 | ||
| 10 | 10 | ||
| 11 | 11 | <img alt="MapGIS" src="website/public/static/assets/logo/framework.png"> | |
| 12 | 12 | ||
| 13 | 13 | ## 目录 | |
| 14 | 14 | ||
| 15 | - - [开始](#目录) | ||
| 16 | - - [司马云](#司马云) | ||
| 17 | - - [github](#github) | ||
| 18 | - - [特性](#特性) | ||
| 19 | - - [示例](#示例) | ||
| 20 | - - [深入了解](#深入了解) | ||
| 21 | - - [代码结构](#代码结构) | ||
| 22 | - - [编译](#编译) | ||
| 23 | - - [问题](#问题) | ||
| 24 | - - [依赖](#依赖) | ||
| 25 | - - [资源](#资源) | ||
| 26 | - - [在线资源](#在线资源) | ||
| 27 | - - [在线服务](#在线服务) | ||
| 28 | - - [团队](#团队) | ||
| 29 | - - [证书](#证书) | ||
| 30 | - | ||
| 31 | - ### 司马云 | ||
| 32 | - [MapGIS Client for Javascript](http://develop.smaryun.com:8899/) | ||
| 15 | + - [一、开始](#目录) | ||
| 16 | + - [1、司马云](#1、司马云) | ||
| 17 | + - [2、GitHub](#2、GitHub) | ||
| 18 | + - [3、特性](#3、特性) | ||
| 19 | + - [4、示例](#4、示例) | ||
| 20 | + - [二、深入了解](#二、深入了解) | ||
| 21 | + - [1、代码结构](#1、代码结构) | ||
| 22 | + - [2、编译](#2、编译) | ||
| 23 | + - [3、问题](#3、问题) | ||
| 24 | + - [4、依赖](#4、依赖) | ||
| 25 | + - [三、资源](#三、资源) | ||
| 26 | + - [1、在线资源](#1、在线资源) | ||
| 27 | + - [2、在线服务](#2、在线服务) | ||
| 28 | + - [四、团队](#四、团队) | ||
| 29 | + - [五、证书](#五、证书) | ||
| 30 | + | ||
| 31 | + ## 一、开始 | ||
| 32 | + | ||
| 33 | + ### 1、司马云 | ||
| 34 | + [MapGIS Client for JavaScript](http://develop.smaryun.com:8899/) | ||
| 33 | 35 | ||
| 34 | 36 | > 本脚本所有的示例都在对应的演示站点有详细的说明教程 | |
| 35 | 37 | ||
| 36 | - ### github | ||
| 37 | - 1. github是初始模板,物理上整合了leaflet,mapboxgl,cesium,openlayers, zondyclient等多个脚本,仅做技术验证&选型 | ||
| 38 | - 1. 司马云在逻辑上重构设计webclient-javascript,整合统一igserver,datastore,d3,mapv,echarts主流开源技术,基础平台长期维护 | ||
| 39 | - 1. 更多详情请查看司马云 www.smaryun.com | ||
| 38 | + ### 2、GitHub | ||
| 39 | + 1. GitHub是初始模板,物理上整合了leaflet,mapboxgl,cesium,openlayers, zondyclient等多个脚本,仅做技术验证&选型 | ||
| 40 | + 2. 司马云在逻辑上重构设计webclient-javascript,整合统一igserver,datastore,d3,mapv,echarts主流开源技术,基础平台长期维护 | ||
| 41 | + 3. 更多详情请查看司马云 www.smaryun.com | ||
| 40 | 42 | ||
| 41 | - ### 特性 | ||
| 43 | + ### 3、特性 | ||
| 42 | 44 | |四大地图引擎|融合热门前端可视化技术|多样化开发方式| | |
| 43 | 45 | |:---|:---|:---| | |
| 44 | 46 | |<img alt="MapGIS" src="website/public/static/assets/bane/sub11.png">|<img alt="MapGIS" src="website/public/static/assets/bane/sub22.png">|<img alt="MapGIS" src="website/public/static/assets/bane/sub33.png">| | |
| 45 | 47 | ||
| 46 | - | ||
| 47 | - ### 示例 | ||
| 48 | + ### 4、示例 | ||
| 48 | 49 | <p align="center"> | |
| 49 | 50 | <a href=""> | |
| 50 | 51 | <img src="website/public/static/assets/gallery/m3d-bim.png" height="150" /> | |
@@ -88,8 +89,8 @@ MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openla | |||
| 88 | 89 | </a> | |
| 89 | 90 | </p> | |
| 90 | 91 | ||
| 91 | - ## 深入了解 | ||
| 92 | - ### 代码结构 | ||
| 92 | + ## 二、深入了解 | ||
| 93 | + ### 1、代码结构 | ||
| 93 | 94 | ``` text | |
| 94 | 95 | |-- WebClient-JavaSript | |
| 95 | 96 | |-- docs -- JsDoc文档生成模块 | |
@@ -110,47 +111,60 @@ MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openla | |||
| 110 | 111 | |-- src -- 示例网页的vue代码 | |
| 111 | 112 | ``` | |
| 112 | 113 | ||
| 113 | - ### 编译 | ||
| 114 | - 0. 安装依赖 | ||
| 114 | + ### 2、运行示例网站 | ||
| 115 | + | ||
| 116 | + 1. 进入示例网站对应的目录 | ||
| 117 | + | ||
| 118 | + ``` sh | ||
| 119 | + cd website | ||
| 120 | + ``` | ||
| 121 | + | ||
| 122 | + 2. 安装依赖 | ||
| 123 | + | ||
| 124 | + ``` sh | ||
| 125 | + npm install | ||
| 126 | + ``` | ||
| 127 | + | ||
| 128 | + 3. 运行网页 | ||
| 129 | + | ||
| 130 | + ``` sh | ||
| 131 | + npm start | ||
| 132 | + ``` | ||
| 133 | + | ||
| 134 | + ### 3、编译 | ||
| 135 | + | ||
| 136 | + 如果您需修改源码,可自行编译打包生成OpenLayers、Leaflet、MapBoxGL、Cesium的地图引擎库、API文档。 | ||
| 137 | + | ||
| 138 | + 1. 安装依赖 | ||
| 115 | 139 | ``` sh | |
| 116 | 140 | npm install | |
| 117 | 141 | ``` | |
| 118 | 142 | ||
| 119 | - 1. 地图引擎编译 | ||
| 143 | + 2. 地图引擎编译 | ||
| 120 | 144 | ``` sh | |
| 121 | 145 | npm run mapbox-debug #编译调式版本 服务与开源地图脚本一起编译打包 | |
| 122 | 146 | npm run mapbox-release #编译生产版本 服务与开源地图脚本一起编译打包 | |
| 123 | 147 | npm run mapbox-plugin-debug #编译调式版本 服务与开源地图脚本独立编译打包 | |
| 124 | - npm run mapbox-plugin-release #编译调式版本 服务与开源地图脚本独立编译打包 | ||
| 148 | + npm run mapbox-plugin-release #编译生产版本 服务与开源地图脚本独立编译打包 | ||
| 125 | 149 | ``` | |
| 126 | 150 | ||
| 127 | - 2. 单独服务编译 | ||
| 151 | + 3. 单独服务编译 | ||
| 128 | 152 | ``` sh | |
| 129 | 153 | npm run service-debug #单独编译服务调试版本 | |
| 130 | 154 | npm run service-release #单独编译服务生产版本 | |
| 131 | 155 | ``` | |
| 132 | 156 | ||
| 133 | - ### 运行示例网页 | ||
| 134 | - 1. 进入对应的目录 | ||
| 135 | - ``` sh | ||
| 136 | - cd website | ||
| 137 | - ``` | ||
| 138 | - | ||
| 139 | - 1. 安装依赖 | ||
| 157 | + 4. API文档生成 | ||
| 140 | 158 | ``` sh | |
| 141 | - npm install | ||
| 159 | + build-docs-leaflet #生成API参考文档 | ||
| 142 | 160 | ``` | |
| 143 | - 1. 运行网页 | ||
| 144 | - ``` sh | ||
| 145 | - npm start | ||
| 146 | - ``` | ||
| 147 | 161 | ||
| 148 | - ### 问题 | ||
| 162 | + ### 3、问题 | ||
| 149 | 163 | ||
| 150 | 164 | * [判断多边形自相交?](https://github.com/MapGIS/WebClient-JavaScript/issues/18) | |
| 151 | 165 | * [后台空间分析出错误?](https://github.com/MapGIS/WebClient-JavaScript/issues/5) | |
| 152 | 166 | ||
| 153 | - ### 依赖 | ||
| 167 | + ### 4、依赖 | ||
| 154 | 168 | ||
| 155 | 169 | * leaflet [1.0+ ~ 1.5.1-](https://leafletjs.com/2019/05/08/leaflet-1.5.1.html) ([CDN链接](https://unpkg.com/leaflet@1.5.1/dist/leaflet.js)) | |
| 156 | 170 | * [Leaflet](http://leafletjs.com) version 1.0以上 1.5.1以下 | |
@@ -161,16 +175,15 @@ MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openla | |||
| 161 | 175 | * cesium | |
| 162 | 176 | * [mapgis司马云pro版本-cesium]() | |
| 163 | 177 | ||
| 178 | + ## 三、资源 | ||
| 164 | 179 | ||
| 165 | - ## 资源 | ||
| 166 | - | ||
| 167 | - ### 在线资源 | ||
| 180 | + ### 1、在线资源 | ||
| 168 | 181 | [资源中心-云开发世界](http://www.smaryun.com/dev/resource_center.html#/type27/tag184/page1) | |
| 169 | 182 | ||
| 170 | - ### 在线服务 | ||
| 183 | + ### 2、在线服务 | ||
| 171 | 184 | [问答社区-云听](http://www.smaryun.com/cloudlisten/index.php) | |
| 172 | 185 | ||
| 173 | - ### 团队 | ||
| 186 | + ### 四、团队 | ||
| 174 | 187 | ||
| 175 | 188 | * 协议格式 | |
| 176 | 189 | * `M3D` [M3D三维部门]() | |
@@ -180,7 +193,7 @@ MapGIS Client for JavaScript:是增强的MapGIS Web开发平台,集成Openla | |||
| 180 | 193 | * 前端 | |
| 181 | 194 | * `技术支持` [技术支持部]() | |
| 182 | 195 | ||
| 183 | - ### 证书 | ||
| 196 | + ### 五、证书 | ||
| 184 | 197 | ||
| 185 | 198 | Copyright © 2020-2024 MapGIS | |
| 186 | 199 | ||
| Original file line number | Diff line number | Diff line change | |
|---|---|---|---|
@@ -1,69 +1,141 @@ | |||
| 1 | - # MapGIS Webclient Javascript Website | ||
| 1 | + # MapGIS Client for JavaScript 示例站点使用说明 | ||
| 2 | + | ||
| 3 | + - [MapGIS Client for JavaScript 示例站点使用说明](#mapgis-client-for-javascript-示例站点使用说明) | ||
| 4 | + - [一、目录结构](#一目录结构) | ||
| 5 | + - [二、示例运行](#二示例运行) | ||
| 6 | + - [1、安装依赖环境](#1安装依赖环境) | ||
| 7 | + - [2、编译测试](#2编译测试) | ||
| 8 | + - [3、代码格式检查](#3代码格式检查) | ||
| 9 | + - [4、打包](#4打包) | ||
| 10 | + - [5、自定义配置](#5自定义配置) | ||
| 11 | + - [三、站点发布](#三站点发布) | ||
| 12 | + - [1. Windows](#1-windows) | ||
| 13 | + - [2. Linux](#2-linux) | ||
| 14 | + - [3. Node.js](#3-nodejs) | ||
| 15 | + - [4. express windows-server-2003](#4-express-windows-server-2003) | ||
| 16 | + - [四、离线站点部署](#四离线站点部署) | ||
| 17 | + | ||
| 18 | + ## 一、目录结构 | ||
| 19 | + | ||
| 20 | + ``` text | ||
| 21 | + |-- website -- 示例网站 | ||
| 22 | + |-- express -- node服务,在一些wind2003等老机器上替代IIS | ||
| 23 | + |-- public -- 网页的公共路径 | ||
| 24 | + |-- docs -- 各项API资源目录 | ||
| 25 | + |-- static -- 示例目录 | ||
| 26 | + |-- assets -- 公共图片 | ||
| 27 | + |-- data -- 公共数据 | ||
| 28 | + |-- demo -- 示例代码 | ||
| 29 | + |-- cesium -- Cesium示例 | ||
| 30 | + |-- example -- Cesium示例代码 | ||
| 31 | + |-- markdown -- Cesium示例说明 | ||
| 32 | + |-- gallery -- Cesium示例功能效果图 | ||
| 33 | + |-- config -- 含示例目录配置文件 | ||
| 34 | + |-- leaflet -- Leaflet示例 | ||
| 35 | + |-- mapboxgl -- MapBoxGL示例 | ||
| 36 | + |-- openlayers -- OpenLayers示例 | ||
| 37 | + |-- libs -- 引用库 | ||
| 38 | + |-- src -- 示例网页的vue代码 | ||
| 39 | + ``` | ||
| 40 | + MapGIS Client for JavaScript资源站点编译后将生成dist目录,包括开发库、示例站点、API文档等,主要目录结构如下: | ||
| 41 | + ``` text | ||
| 42 | + |-- dist -- website编译后的目录 | ||
| 43 | + |-- docs -- 各项API资源目录 | ||
| 44 | + |-- static -- 示例目录 | ||
| 45 | + |-- assets -- 公共图片 | ||
| 46 | + |-- data -- 公共数据 | ||
| 47 | + |-- demo -- 示例代码 | ||
| 48 | + |-- cesium -- Cesium示例 | ||
| 49 | + |-- example -- Cesium示例代码 | ||
| 50 | + |-- markdown -- Cesium示例说明 | ||
| 51 | + |-- gallery -- Cesium示例功能效果图 | ||
| 52 | + |-- config -- 含示例目录配置文件 | ||
| 53 | + |-- leaflet -- Leaflet示例 | ||
| 54 | + |-- mapboxgl -- MapBoxGL示例 | ||
| 55 | + |-- openlayers -- OpenLayers示例 | ||
| 56 | + |-- libs -- 引用库 | ||
| 57 | + |-- index.html -- 资源站点首页 | ||
| 58 | + ``` | ||
| 59 | + | ||
| 60 | + >司马云-产品开发包的MapGIS Client for JavaScript开发包为编译后的产品包(对应上面dist目录),可支持离线环境下部署使用,具体操作请参考本文档第三、四部分内容。在线环境推荐从开源社区上拉取。 | ||
| 61 | + | ||
| 62 | + | ||
| 63 | + ## 二、示例运行 | ||
| 2 | 64 | ||
| 3 | - ## 安装依赖环境 | ||
| 65 | + 提供 npm 和 yarn 两种方式编译、运行、打包站点,在安装依赖环境前,需配置 Node.js 或 yarn 环境,然后采用对应的命令执行相应的操作。 | ||
| 66 | + | ||
| 67 | + ### 1、安装依赖环境 | ||
| 4 | 68 | ||
| 5 | 69 | ``` | |
| 6 | 70 | npm install | |
| 7 | 71 | # or | |
| 8 | 72 | yarn install | |
| 9 | 73 | ``` | |
| 10 | 74 | ||
| 11 | - ### 编译测试 | ||
| 75 | + ### 2、编译测试 | ||
| 12 | 76 | ||
| 13 | 77 | ``` | |
| 14 | 78 | npm run serve | |
| 15 | 79 | # or | |
| 16 | 80 | yarn serve | |
| 17 | 81 | ``` | |
| 18 | 82 | ||
| 19 | - ### 打包 | ||
| 83 | + ### 3、代码格式检查 | ||
| 20 | 84 | ||
| 21 | 85 | ``` | |
| 22 | - npm run build | ||
| 86 | + npm run lint | ||
| 23 | 87 | # or | |
| 24 | - yarn build | ||
| 88 | + yarn lint | ||
| 25 | 89 | ``` | |
| 26 | 90 | ||
| 27 | - ### 代码格式检查 | ||
| 91 | + ### 4、打包 | ||
| 28 | 92 | ||
| 29 | 93 | ``` | |
| 30 | - npm run lint | ||
| 94 | + npm run build | ||
| 31 | 95 | # or | |
| 32 | - yarn lint | ||
| 96 | + yarn build | ||
| 33 | 97 | ``` | |
| 34 | 98 | ||
| 35 | - ### 自定义配置 | ||
| 99 | + ### 5、自定义配置 | ||
| 36 | 100 | ||
| 37 | 101 | 请看 [配置引用](https://cli.vuejs.org/config/). | |
| 38 | 102 | ||
| 39 | - # 发布 | ||
| 103 | + ## 三、站点发布 | ||
| 40 | 104 | ||
| 41 | - 直接将 | ||
| 105 | + 在示例站点目录执行如下命令打包,打包成功后会在website目录下生成dist文件夹,站点发布时需将此目录发布。(特别说明:司马云-产品开发包的MapGIS Client for JavaScript开发包为编译后的产品包,对应dist目录,直接发布即可) | ||
| 42 | 106 | ||
| 43 | 107 | ``` | |
| 44 | 108 | npm run build | |
| 45 | 109 | # or | |
| 46 | 110 | yarn build | |
| 47 | 111 | ``` | |
| 48 | 112 | ||
| 49 | - ## 1. windows | ||
| 113 | + ### 1. Windows | ||
| 50 | 114 | ||
| 51 | - > window2008 后(包括 2008)版本直接使用 IIS 的 dist 目录发布到对应的 IIS 服务中即可正常使用。 | ||
| 115 | + > 对于Windows 2008 后(包括 2008)的版本,直接使用 IIS 将 website/dist 目录发布到 IIS 服务中即可正常使用。 | ||
| 52 | 116 | ||
| 53 | - ## 2. linux | ||
| 117 | + ### 2. Linux | ||
| 54 | 118 | ||
| 55 | 119 | > 使用 nginx / tomcat 发布 dist 目录的网页 | |
| 56 | 120 | ||
| 57 | - ## 3. nodejs | ||
| 121 | + ### 3. Node.js | ||
| 58 | 122 | ||
| 59 | 123 | > 请使用 http-server 来预览网页 | |
| 60 | 124 | ||
| 125 | + 需在website目录中配置http-server环境: | ||
| 126 | + | ||
| 127 | + ``` | ||
| 128 | + npm install -g http-server | ||
| 129 | + ``` | ||
| 130 | + | ||
| 131 | + 然后调用如下命令发布网站: | ||
| 132 | + | ||
| 61 | 133 | ``` | |
| 62 | - cd /path/to/website | ||
| 134 | + cd /path/to/website/dist | ||
| 63 | 135 | http-server -p 8899 | |
| 64 | 136 | ``` | |
| 65 | 137 | ||
| 66 | - ## 4. express windows-server-2003 | ||
| 138 | + ### 4. express windows-server-2003 | ||
| 67 | 139 | ||
| 68 | 140 | express 后台运行发布 | |
| 69 | 141 | ||
@@ -102,26 +174,26 @@ express 后台运行发布 | |||
| 102 | 174 | ```sh | |
| 103 | 175 | node windowserver.js | |
| 104 | 176 | ``` | |
| 105 | - 7. 在 windows 的服务中,启动服务,默认情况是随开机自启的 | ||
| 177 | + 7. 在 Windows 的服务中,启动服务,默认情况是随开机自启的 | ||
| 106 | 178 | ||
| 107 | - # 离线部署站点 | ||
| 179 | + ## 四、离线站点部署 | ||
| 108 | 180 | ||
| 109 | - > 将 public/static/libs/include-xxx-local.js 文本种尾部的 webclient 的配置项中的 ip,端口,协议改成对应的局域网 ip 即可实现。 | ||
| 181 | + > 将 public/static/libs/include-xxx-local.js 文本种尾部的 webclient 配置项中的 ip、端口、协议改成对应的局域网对应的即可实现离线部署,访问局域网的相关服务 | ||
| 110 | 182 | ||
| 111 | 183 | ```js | |
| 112 | 184 | // public/static/libs/include-xxx-local.js | |
| 113 | 185 | window.webclient = { | |
| 114 | - ip: 'develop.smaryun.com', | ||
| 115 | - port: 6163, | ||
| 116 | - protocol: 'http' | ||
| 186 | + ip: 'develop.smaryun.com', | ||
| 187 | + port: 6163, | ||
| 188 | + protocol: 'http' | ||
| 117 | 189 | }; | |
| 118 | 190 | ``` | |
| 119 | 191 | ||
| 120 | - > 示例中的地址自动被替换成对应的局域网的地址 | ||
| 192 | + > 示例中的服务访问地址将自动被替换成对应的局域网的地址 | ||
| 121 | 193 | ||
| 122 | 194 | ```js | |
| 123 | - //加载M3D地图文档(服务地址,配置参数) | ||
| 124 | - var { protocol, ip, port } = window.webclient; | ||
| 125 | - landscapeLayer = m3dLayer.append(`${protocol}://${ip}:${port}/igs/rest/g3d/ZondyModels`; | ||
| 126 | - // http://develop.smaryun.com:6163 => http://ip:port | ||
| 195 | + var { protocol, ip, port } = window.webclient; | ||
| 196 | + //加载M3D地图文档(服务地址,配置参数) | ||
| 197 | + var landscapeLayer = m3dLayer.append(`${protocol}://${ip}:${port}/igs/rest/g3d/ZondyModels`; | ||
| 198 | + //地址转换:http://develop.smaryun.com:6163 => http://ip:port | ||
| 127 | 199 | ``` | |
| Back | FazBrowse Home | New Git URL |
0 commit comments