From cb6447419b64087c46d7a951ad6da4a54026296b Mon Sep 17 00:00:00 2001 From: Zihua Wu Date: Sun, 15 Dec 2019 14:37:43 +0800 Subject: [PATCH 1/2] Fix typo --- docs/api/source/image.zh.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/api/source/image.zh.md b/docs/api/source/image.zh.md index 153208b5b2..5901901b54 100644 --- a/docs/api/source/image.zh.md +++ b/docs/api/source/image.zh.md @@ -3,7 +3,7 @@ title: Image order: 4 --- -Image 数据主要用于在地图根据经纬度范围添加图图片,不如一幅纸制地图扫描版你要放在地图显示。 +Image 数据主要用于在地图根据经纬度范围添加图图片,比如一幅纸制地图扫描版你要放在地图显示。 ## parser From f6b08e070d35ef1820daae9941d48577677f6662 Mon Sep 17 00:00:00 2001 From: randysheng Date: Wed, 18 Dec 2019 22:22:18 +0800 Subject: [PATCH 2/2] fix(doc): remove duplicated method --- docs/api/scene.en.md | 216 ++++++++++++++++++++++--------------------- docs/api/scene.zh.md | 216 ++++++++++++++++++++++--------------------- 2 files changed, 225 insertions(+), 207 deletions(-) diff --git a/docs/api/scene.en.md b/docs/api/scene.en.md index 314e909838..ad50dc22bd 100644 --- a/docs/api/scene.en.md +++ b/docs/api/scene.en.md @@ -15,7 +15,7 @@ const scene = new Scene({ id: 'map', map: new GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), }); @@ -25,75 +25,73 @@ const scene = new L7.Scene({ id: 'map', map: new L7.GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), }); ``` - ## Map - L7 地理可视化侧重于地理数据的可视化表达,地图层需要依赖第三方地图,第三方地图通过Scene 统一创建,创建管理 - 只需要通过Scene传入地图配置项即可。 +L7 地理可视化侧重于地理数据的可视化表达,地图层需要依赖第三方地图,第三方地图通过 Scene 统一创建,创建管理 +只需要通过 Scene 传入地图配置项即可。 -目前L7 支持两种地图底图 +目前 L7 支持两种地图底图 - 高德地图 国内业务场景 合规中国地图 - MapBox 国际业务,或者内网离线部署场景 +### map -### map - -可以通过scene map 属性获取 map实例 +可以通过 scene map 属性获取 map 实例 ```javascript -const map = scene.map - +const map = scene.map; ``` -为了统一不同底图之前的接口差异 L7 在scene层对map的方法做了统一,因此一些地图的操作方法可以通过scene调用这样,切换不同底图时保证表现一致。 + +为了统一不同底图之前的接口差异 L7 在 scene 层对 map 的方法做了统一,因此一些地图的操作方法可以通过 scene 调用这样,切换不同底图时保证表现一致。 示例代码 ```javascript -const scene =new L7.Scene({ +const scene = new L7.Scene({ id: 'map', map: new L7.GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), -}) +}); ``` - ### 构造函数 -**Scene** - - - +**Scene** ## 配置项 ### 地图配置项 ### id + 需传入 dom 容器或者容器 id  {domObject || string} [必选] - ### zoom -地图初始显示级别 {number} (0-22) + +地图初始显示级别 {number} (0-22) ### center + 地图初始中心经纬度 {Lnglat} ### pitch + 地图初始俯仰角度 {number}  default 0 ### style 简化地图样式设置,L7 内置了三种主题默认样式 高德,mapbox 都可以使用 + - dark - light - normal @@ -103,62 +101,69 @@ const scene =new L7.Scene({ 比如高德地图 ```javascript - { - style:'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true' // 设置方法和高德地图一致 - } - +{ + style: 'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true'; // 设置方法和高德地图一致 +} ``` - ### minZoom -地图最小缩放等级 {number}  default 0 (0-22) + +地图最小缩放等级 {number}  default 0 (0-22) ### maxZoom -地图最大缩放等级 {number}  default 22 (0-22) + +地图最大缩放等级 {number}  default 22 (0-22) ### rotateEnable + 地图是否可旋转 {Boolean} default true - - - ## 方法 ### getZoom + 获取当前缩放等级 ```javascript scene.getZoom(); ``` -return {float}  当前缩放等级 +return {float}   当前缩放等级 ### getLayers() + 获取所有的地图图层 + ```javascript scene.getLayers(); ``` -return 图层数组 {Array} - +return 图层数组 {Array} ### getCenter() + 获取地图中心点 + ```javascript -scene.getCenter() +scene.getCenter(); ``` return {Lnglat} :地图中心点 ### getSize() + 获取地图容器大小 + ```javascript -scene.getSize() +scene.getSize(); ``` + return { Object } 地图容器的 width,height ### getPitch() + 获取地图俯仰角 + ```javascript scene.getPitch(); ``` @@ -167,9 +172,9 @@ return {number} pitch ### setMapStyle -参数:`style` {string} 地图样式 具体样式格式和各底图设置方法一致 +参数:`style` {string} 地图样式 具体样式格式和各底图设置方法一致 -L7 内置了三种地图样式,AMAP 和MapBox都适用 +L7 内置了三种地图样式,AMAP 和 MapBox 都适用 - light - dark @@ -183,150 +188,153 @@ L7 内置了三种地图样式,AMAP 和MapBox都适用 scene.setMapStyle('light'); // mapbox 主题设置 -scene.setMapStyle('mapbox://styles/mapbox/streets-v11') - -// AMap -scene.setMapStyle('amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true') +scene.setMapStyle('mapbox://styles/mapbox/streets-v11'); +// AMap +scene.setMapStyle( + 'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true', +); ``` ### setCenter() + 设置地图中心点坐标 ```javascript -scene.setCenter([lng,lat]) +scene.setCenter([lng, lat]); ``` -参数:`center` {LngLat} 地图中心点 - +参数:`center` {LngLat} 地图中心点 ### setZoomAndCenter + 设置地图等级和中心 + ```javascript -scene.setZoomAndCenter(zoom,center) +scene.setZoomAndCenter(zoom, center); ``` 参数:zoom {number}
center {LngLat} - ### setRotation + 设置地图顺时针旋转角度,旋转原点为地图容器中心点,取值范围 [0-360] + ```javascript -scene.setRotation(rotation) +scene.setRotation(rotation); ``` -参数: `rotation` {number} +参数: `rotation` {number} ### zoomIn + 地图放大一级 + ```javascript -scene.zoomIn() +scene.zoomIn(); ``` ### zoomOut + 地图缩小一级 + ```javascript -scene.ZoomOUt() +scene.ZoomOUt(); ``` ### panTo + 地图平移到指定的位置 + ```javascript -scene.panTo(LngLat) +scene.panTo(LngLat); ``` -参数:`center` LngLat 中心位置坐标 +参数:`center` LngLat 中心位置坐标 ### panBy -以像素为单位沿X方向和Y方向移动地图 -```javascript -scene.panBy(x,y) -``` -参数:
`x` {number} 水平方向移动像素 向右为正方向
      `y` {number} 垂直方向移动像素 向下为正方向 +以像素为单位沿 X 方向和 Y 方向移动地图 + +```javascript +scene.panBy(x, y); +``` + +参数:
`x` {number} 水平方向移动像素 向右为正方向
      `y` {number} 垂直方向移动像素 向下为正方向 ### setPitch + 设置地图仰俯角度 + ```javascript -scene.setPitch(pitch) +scene.setPitch(pitch); ``` -参数 :
   `pitch` {number} - +参数 :
   `pitch` {number} ### fitBounds + 地图缩放到某个范围内
参数 :
  `extent` { array} 经纬度范围 [minlng,minlat,maxlng,maxlat] ```javascript -scene.fitBounds([112,32,114,35]); +scene.fitBounds([112, 32, 114, 35]); ``` - - ### removeLayer -移除layer + +移除 layer ```javascript -scene.removeLayer(layer) +scene.removeLayer(layer); ``` -参数 `layer` {Layer} - -### getLayers - 获取所有的layer - -```javascript -scene.getLayers() -``` - -return layers  {array} +参数 `layer` {Layer} ## 事件 - ### on + 事件监听 #### 参数 -`eventName` {string} 事件名
`hander` {function } 事件回调函数 +`eventName` {string} 事件名
`hander` {function } 事件回调函数 ### off -移除事件监听
`eventName` {string} 事件名
`hander` {function } 事件回调函数 +移除事件监听
`eventName` {string} 事件名
`hander` {function } 事件回调函数 ### 地图事件 -```javascript -scene.on('loaded',()=>{})  //地图加载完成触发 -scene.on('mapmove',()=>{}) // 地图平移时触发事件 -scene.on('movestart',()=>{}) // 地图平移开始时触发 -scene.on('moveend',()=>{}) // 地图移动结束后触发,包括平移,以及中心点变化的缩放。如地图有拖拽缓动效果,则在缓动结束后触发 -scene.on('zoomchange',()=>{}) // 地图缩放级别更改后触发 -scene.on('zoomstart',()=>{}) // 缩放开始时触发 -scene.on('zoomend',()=>{}) // 缩放停止时触发 -``` +```javascript +scene.on('loaded', () => {}); //地图加载完成触发 +scene.on('mapmove', () => {}); // 地图平移时触发事件 +scene.on('movestart', () => {}); // 地图平移开始时触发 +scene.on('moveend', () => {}); // 地图移动结束后触发,包括平移,以及中心点变化的缩放。如地图有拖拽缓动效果,则在缓动结束后触发 +scene.on('zoomchange', () => {}); // 地图缩放级别更改后触发 +scene.on('zoomstart', () => {}); // 缩放开始时触发 +scene.on('zoomend', () => {}); // 缩放停止时触发 +``` ### 鼠标事件 ```javascript -scene.on('click', (ev)=>{}); // 鼠标左键点击事件 -scene.on('dblclick', (ev)=>{}); // 鼠标左键双击事件 -scene.on('mousemove', (ev)=>{}); // 鼠标在地图上移动时触发 -scene.on('mousewheel', (ev)=>{}); // 鼠标滚轮开始缩放地图时触发 -scene.on('mouseover', (ev)=>{}); // 鼠标移入地图容器内时触发 -scene.on('mouseout', (ev)=>{}); // 鼠标移出地图容器时触发 -scene.on('mouseup', (ev)=>{}); // 鼠标在地图上单击抬起时触发 -scene.on('mousedown', (ev)=>{}); // 鼠标在地图上单击按下时触发 -scene.on('rightclick', (ev)=>{}); // 鼠标右键单击事件 -scene.on('dragstart', (ev)=>{}); //开始拖拽地图时触发 -scene.on('dragging', (ev)=>{}); // 拖拽地图过程中触发 -scene.on('dragend', (ev)=>{}); //停止拖拽地图时触发。如地图有拖拽缓动效果,则在拽停止,缓动开始前触发 +scene.on('click', (ev) => {}); // 鼠标左键点击事件 +scene.on('dblclick', (ev) => {}); // 鼠标左键双击事件 +scene.on('mousemove', (ev) => {}); // 鼠标在地图上移动时触发 +scene.on('mousewheel', (ev) => {}); // 鼠标滚轮开始缩放地图时触发 +scene.on('mouseover', (ev) => {}); // 鼠标移入地图容器内时触发 +scene.on('mouseout', (ev) => {}); // 鼠标移出地图容器时触发 +scene.on('mouseup', (ev) => {}); // 鼠标在地图上单击抬起时触发 +scene.on('mousedown', (ev) => {}); // 鼠标在地图上单击按下时触发 +scene.on('rightclick', (ev) => {}); // 鼠标右键单击事件 +scene.on('dragstart', (ev) => {}); //开始拖拽地图时触发 +scene.on('dragging', (ev) => {}); // 拖拽地图过程中触发 +scene.on('dragend', (ev) => {}); //停止拖拽地图时触发。如地图有拖拽缓动效果,则在拽停止,缓动开始前触发 ``` ### 其它事件 + ```javascript -scene.on('resize',()=>{}) // 地图容器大小改变事件 +scene.on('resize', () => {}); // 地图容器大小改变事件 ``` - - diff --git a/docs/api/scene.zh.md b/docs/api/scene.zh.md index 1bbbb1c249..27fa18b6a7 100644 --- a/docs/api/scene.zh.md +++ b/docs/api/scene.zh.md @@ -15,7 +15,7 @@ const scene = new Scene({ id: 'map', map: new GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), }); @@ -25,75 +25,73 @@ const scene = new L7.Scene({ id: 'map', map: new L7.GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), }); ``` - ## Map - L7 地理可视化侧重于地理数据的可视化表达,地图层需要依赖第三方地图,第三方地图通过Scene 统一创建,创建管理 - 只需要通过Scene传入地图配置项即可。 +L7 地理可视化侧重于地理数据的可视化表达,地图层需要依赖第三方地图,第三方地图通过 Scene 统一创建,创建管理 +只需要通过 Scene 传入地图配置项即可。 -目前L7 支持两种地图底图 +目前 L7 支持两种地图底图 - 高德地图 国内业务场景 合规中国地图 - MapBox 国际业务,或者内网离线部署场景 +### map -### map - -可以通过scene map 属性获取 map实例 +可以通过 scene map 属性获取 map 实例 ```javascript -const map = scene.map - +const map = scene.map; ``` -为了统一不同底图之前的接口差异 L7 在scene层对map的方法做了统一,因此一些地图的操作方法可以通过scene调用这样,切换不同底图时保证表现一致。 + +为了统一不同底图之前的接口差异 L7 在 scene 层对 map 的方法做了统一,因此一些地图的操作方法可以通过 scene 调用这样,切换不同底图时保证表现一致。 示例代码 ```javascript -const scene =new L7.Scene({ +const scene = new L7.Scene({ id: 'map', map: new L7.GaodeMap({ style: 'dark', - center: [ 110.770672, 34.159869 ], + center: [110.770672, 34.159869], pitch: 45, }), -}) +}); ``` - ### 构造函数 -**Scene** - - - +**Scene** ## 配置项 ### 地图配置项 ### id + 需传入 dom 容器或者容器 id  {domObject || string} [必选] - ### zoom -地图初始显示级别 {number} (0-22) + +地图初始显示级别 {number} (0-22) ### center + 地图初始中心经纬度 {Lnglat} ### pitch + 地图初始俯仰角度 {number}  default 0 ### style 简化地图样式设置,L7 内置了三种主题默认样式 高德,mapbox 都可以使用 + - dark - light - normal @@ -103,62 +101,69 @@ const scene =new L7.Scene({ 比如高德地图 ```javascript - { - style:'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true' // 设置方法和高德地图一致 - } - +{ + style: 'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true'; // 设置方法和高德地图一致 +} ``` - ### minZoom -地图最小缩放等级 {number}  default 0 (0-22) + +地图最小缩放等级 {number}  default 0 (0-22) ### maxZoom -地图最大缩放等级 {number}  default 22 (0-22) + +地图最大缩放等级 {number}  default 22 (0-22) ### rotateEnable + 地图是否可旋转 {Boolean} default true - - - ## 方法 ### getZoom + 获取当前缩放等级 ```javascript scene.getZoom(); ``` -return {float}  当前缩放等级 +return {float}   当前缩放等级 ### getLayers() + 获取所有的地图图层 + ```javascript scene.getLayers(); ``` -return 图层数组 {Array} - +return 图层数组 {Array} ### getCenter() + 获取地图中心点 + ```javascript -scene.getCenter() +scene.getCenter(); ``` return {Lnglat} :地图中心点 ### getSize() + 获取地图容器大小 + ```javascript -scene.getSize() +scene.getSize(); ``` + return { Object } 地图容器的 width,height ### getPitch() + 获取地图俯仰角 + ```javascript scene.getPitch(); ``` @@ -167,9 +172,9 @@ return {number} pitch ### setMapStyle -参数:`style` {string} 地图样式 具体样式格式和各底图设置方法一致 +参数:`style` {string} 地图样式 具体样式格式和各底图设置方法一致 -L7 内置了三种地图样式,AMAP 和MapBox都适用 +L7 内置了三种地图样式,AMAP 和 MapBox 都适用 - light - dark @@ -183,87 +188,103 @@ L7 内置了三种地图样式,AMAP 和MapBox都适用 scene.setMapStyle('light'); // mapbox 主题设置 -scene.setMapStyle('mapbox://styles/mapbox/streets-v11') - -// AMap -scene.setMapStyle('amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true') +scene.setMapStyle('mapbox://styles/mapbox/streets-v11'); +// AMap +scene.setMapStyle( + 'amap://styles/2a09079c3daac9420ee53b67307a8006?isPublic=true', +); ``` ### setCenter() + 设置地图中心点坐标 ```javascript -scene.setCenter([lng,lat]) +scene.setCenter([lng, lat]); ``` -参数:`center` {LngLat} 地图中心点 - +参数:`center` {LngLat} 地图中心点 ### setZoomAndCenter + 设置地图等级和中心 + ```javascript -scene.setZoomAndCenter(zoom,center) +scene.setZoomAndCenter(zoom, center); ``` 参数: + - zoom {number} - center {LngLat} - ### setRotation + 设置地图顺时针旋转角度,旋转原点为地图容器中心点,取值范围 [0-360] + ```javascript -scene.setRotation(rotation) +scene.setRotation(rotation); ``` -参数: `rotation` {number} +参数: `rotation` {number} ### zoomIn + 地图放大一级 + ```javascript -scene.zoomIn() +scene.zoomIn(); ``` ### zoomOut + 地图缩小一级 + ```javascript -scene.ZoomOUt() +scene.ZoomOUt(); ``` ### panTo + 地图平移到指定的位置 + ```javascript -scene.panTo(LngLat) +scene.panTo(LngLat); ``` 参数: -- `center` LngLat 中心位置坐标 +- `center` LngLat 中心位置坐标 ### panBy -以像素为单位沿X方向和Y方向移动地图 + +以像素为单位沿 X 方向和 Y 方向移动地图 + ```javascript -scene.panBy(x,y) +scene.panBy(x, y); ``` + 参数: - `x` {number} 水平方向移动像素 向右为正方向 -- `y` {number} 垂直方向移动像素 向下为正方向 - +- `y` {number} 垂直方向移动像素 向下为正方向 ### setPitch + 设置地图仰俯角度 + ```javascript -scene.setPitch(pitch) +scene.setPitch(pitch); ``` 参数 : --  `pitch` {number} +- `pitch` {number} ### fitBounds + 地图缩放到某个范围内 参数 : @@ -271,77 +292,66 @@ scene.setPitch(pitch) - `extent` { array} 经纬度范围 [minlng,minlat,maxlng,maxlat] ```javascript -scene.fitBounds([112,32,114,35]); +scene.fitBounds([112, 32, 114, 35]); ``` - - ### removeLayer -移除layer + +移除 layer ```javascript -scene.removeLayer(layer) +scene.removeLayer(layer); ``` -参数 +参数 -- `layer` {Layer} - -### getLayers - 获取所有的layer - -```javascript -scene.getLayers() -``` - -return layers  {array} +- `layer` {Layer} ## 事件 - ### on + 事件监听 #### 参数 -`eventName` {string} 事件名
`hander` {function } 事件回调函数 +`eventName` {string} 事件名
`hander` {function } 事件回调函数 ### off -移除事件监听
`eventName` {string} 事件名
`hander` {function } 事件回调函数 +移除事件监听
`eventName` {string} 事件名
`hander` {function } 事件回调函数 ### 地图事件 -```javascript -scene.on('loaded',()=>{})  //地图加载完成触发 -scene.on('mapmove',()=>{}) // 地图平移时触发事件 -scene.on('movestart',()=>{}) // 地图平移开始时触发 -scene.on('moveend',()=>{}) // 地图移动结束后触发,包括平移,以及中心点变化的缩放。如地图有拖拽缓动效果,则在缓动结束后触发 -scene.on('zoomchange',()=>{}) // 地图缩放级别更改后触发 -scene.on('zoomstart',()=>{}) // 缩放开始时触发 -scene.on('zoomend',()=>{}) // 缩放停止时触发 -``` +```javascript +scene.on('loaded', () => {}); //地图加载完成触发 +scene.on('mapmove', () => {}); // 地图平移时触发事件 +scene.on('movestart', () => {}); // 地图平移开始时触发 +scene.on('moveend', () => {}); // 地图移动结束后触发,包括平移,以及中心点变化的缩放。如地图有拖拽缓动效果,则在缓动结束后触发 +scene.on('zoomchange', () => {}); // 地图缩放级别更改后触发 +scene.on('zoomstart', () => {}); // 缩放开始时触发 +scene.on('zoomend', () => {}); // 缩放停止时触发 +``` ### 鼠标事件 ```javascript -scene.on('click', (ev)=>{}); // 鼠标左键点击事件 -scene.on('dblclick', (ev)=>{}); // 鼠标左键双击事件 -scene.on('mousemove', (ev)=>{}); // 鼠标在地图上移动时触发 -scene.on('mousewheel', (ev)=>{}); // 鼠标滚轮开始缩放地图时触发 -scene.on('mouseover', (ev)=>{}); // 鼠标移入地图容器内时触发 -scene.on('mouseout', (ev)=>{}); // 鼠标移出地图容器时触发 -scene.on('mouseup', (ev)=>{}); // 鼠标在地图上单击抬起时触发 -scene.on('mousedown', (ev)=>{}); // 鼠标在地图上单击按下时触发 -scene.on('rightclick', (ev)=>{}); // 鼠标右键单击事件 -scene.on('dragstart', (ev)=>{}); //开始拖拽地图时触发 -scene.on('dragging', (ev)=>{}); // 拖拽地图过程中触发 -scene.on('dragend', (ev)=>{}); //停止拖拽地图时触发。如地图有拖拽缓动效果,则在拽停止,缓动开始前触发 +scene.on('click', (ev) => {}); // 鼠标左键点击事件 +scene.on('dblclick', (ev) => {}); // 鼠标左键双击事件 +scene.on('mousemove', (ev) => {}); // 鼠标在地图上移动时触发 +scene.on('mousewheel', (ev) => {}); // 鼠标滚轮开始缩放地图时触发 +scene.on('mouseover', (ev) => {}); // 鼠标移入地图容器内时触发 +scene.on('mouseout', (ev) => {}); // 鼠标移出地图容器时触发 +scene.on('mouseup', (ev) => {}); // 鼠标在地图上单击抬起时触发 +scene.on('mousedown', (ev) => {}); // 鼠标在地图上单击按下时触发 +scene.on('rightclick', (ev) => {}); // 鼠标右键单击事件 +scene.on('dragstart', (ev) => {}); //开始拖拽地图时触发 +scene.on('dragging', (ev) => {}); // 拖拽地图过程中触发 +scene.on('dragend', (ev) => {}); //停止拖拽地图时触发。如地图有拖拽缓动效果,则在拽停止,缓动开始前触发 ``` ### 其它事件 + ```javascript -scene.on('resize',()=>{}) // 地图容器大小改变事件 +scene.on('resize', () => {}); // 地图容器大小改变事件 ``` - -