From f16a5e21a01f2ba06974d47a83ebf2ccd3e97fff Mon Sep 17 00:00:00 2001 From: thinkinggis Date: Thu, 28 Nov 2019 15:41:20 +0800 Subject: [PATCH 1/3] =?UTF-8?q?chore(package):=20:=09=F0=9F=8E=87=20=20upd?= =?UTF-8?q?ate=20version?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/component/package.json | 2 +- packages/core/package.json | 2 +- packages/l7/package.json | 2 +- packages/layers/package.json | 2 +- packages/maps/package.json | 2 +- packages/renderer/package.json | 2 +- packages/scene/package.json | 2 +- packages/source/package.json | 2 +- packages/utils/package.json | 2 +- 9 files changed, 9 insertions(+), 9 deletions(-) diff --git a/packages/component/package.json b/packages/component/package.json index 7938264867..e72dd477f2 100644 --- a/packages/component/package.json +++ b/packages/component/package.json @@ -33,7 +33,7 @@ "inversify-logging": "^0.2.1", "load-styles": "^2.0.0" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/core/package.json b/packages/core/package.json index acec33780c..9601a2ee6b 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -43,7 +43,7 @@ "@types/lodash": "^4.14.138", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/l7/package.json b/packages/l7/package.json index 7c3faecac3..fbb87b80d8 100644 --- a/packages/l7/package.json +++ b/packages/l7/package.json @@ -29,7 +29,7 @@ "@antv/l7-maps": "^2.0.0-beta.11", "@antv/l7-scene": "^2.0.0-beta.11" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/layers/package.json b/packages/layers/package.json index c2b633b305..5ab0c52995 100644 --- a/packages/layers/package.json +++ b/packages/layers/package.json @@ -49,7 +49,7 @@ "@types/gl-matrix": "^2.4.5", "@types/lodash": "^4.14.138" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/maps/package.json b/packages/maps/package.json index 71c9e6e2db..e528a8e8cd 100644 --- a/packages/maps/package.json +++ b/packages/maps/package.json @@ -36,7 +36,7 @@ "@types/mapbox-gl": "^0.54.3", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/renderer/package.json b/packages/renderer/package.json index 47f8b8d354..a63817bbb0 100644 --- a/packages/renderer/package.json +++ b/packages/renderer/package.json @@ -30,7 +30,7 @@ "reflect-metadata": "^0.1.13", "regl": "^1.3.11" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/scene/package.json b/packages/scene/package.json index f46639026c..9e3b2e45db 100644 --- a/packages/scene/package.json +++ b/packages/scene/package.json @@ -32,7 +32,7 @@ "mapbox-gl": "^1.2.1", "reflect-metadata": "^0.1.13" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/source/package.json b/packages/source/package.json index d8ba75d5a1..a2a8e1a927 100644 --- a/packages/source/package.json +++ b/packages/source/package.json @@ -49,7 +49,7 @@ "@types/lodash": "^4.14.138", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } diff --git a/packages/utils/package.json b/packages/utils/package.json index d6ddad8f30..915840d87c 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -36,7 +36,7 @@ "@types/gl-matrix": "^2.4.5", "@types/lodash": "^4.14.138" }, - "gitHead": "0563f357f3a07c099bf1ffa9350e6fa3c88353ae", + "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", "publishConfig": { "access": "public" } From bc17add4c32ff3c21bb82cdcf385e538d2eff413 Mon Sep 17 00:00:00 2001 From: thinkinggis Date: Thu, 28 Nov 2019 17:25:56 +0800 Subject: [PATCH 2/3] fix(component): fix marker --- examples/point/chart/demo/bar.js | 12 +- examples/point/chart/demo/chart.js | 11 +- examples/point/chart/demo/ring.js | 119 +++++++++--------- examples/point/marker/demo/marker.js | 11 +- examples/tutorial/marker/demo/amap.js | 4 +- packages/component/package.json | 2 +- packages/core/package.json | 2 +- .../src/services/component/MarkerService.ts | 6 +- packages/l7/package.json | 2 +- packages/layers/package.json | 2 +- packages/maps/package.json | 2 +- packages/renderer/package.json | 2 +- packages/scene/package.json | 2 +- packages/source/package.json | 2 +- packages/utils/package.json | 2 +- stories/Components/components/Marker.tsx | 16 ++- stories/Components/components/Popup.tsx | 19 ++- stories/Components/components/Scale.tsx | 7 +- stories/Components/components/Zoom.tsx | 8 +- 19 files changed, 110 insertions(+), 121 deletions(-) diff --git a/examples/point/chart/demo/bar.js b/examples/point/chart/demo/bar.js index 05c16e3507..3bca7f7451 100644 --- a/examples/point/chart/demo/bar.js +++ b/examples/point/chart/demo/bar.js @@ -11,10 +11,10 @@ const scene = new Scene({ zoom: 4.19 }) }); +addChart(); scene.render(); -scene.on('loaded', () => { - addChart(); -}); + + function addChart() { fetch( 'https://gw.alipayobjects.com/os/basement_prod/0b96cca4-7e83-449a-93d0-2a77053e74ab.json' @@ -67,14 +67,14 @@ function addChart() { .color('item', [ '#5CCEA1', '#5D7092', '#5B8FF9' ]) .opacity(1); chart.render(); - new Marker({ + const marker = new Marker({ element: el }) .setLnglat({ lng: item.coordinates[0], lat: item.coordinates[1] - }) - .addTo(scene); + }); + scene.addMarker(marker); }); }); } diff --git a/examples/point/chart/demo/chart.js b/examples/point/chart/demo/chart.js index abe7a089fb..4cd14788b1 100644 --- a/examples/point/chart/demo/chart.js +++ b/examples/point/chart/demo/chart.js @@ -11,10 +11,9 @@ const scene = new Scene({ zoom: 4.19 }) }); +addChart(); scene.render(); -scene.on('loaded', () => { - addChart(); -}); + function addChart() { fetch( 'https://gw.alipayobjects.com/os/basement_prod/0b96cca4-7e83-449a-93d0-2a77053e74ab.json' @@ -89,14 +88,14 @@ function addChart() { .color('item', [ '#5CCEA1', '#5D7092', '#5B8FF9' ]) .shape('sliceShape'); chart.render(); - new Marker({ + const marker = new Marker({ element: el }) .setLnglat({ lng: item.coordinates[0], lat: item.coordinates[1] - }) - .addTo(scene); + }); + scene.addMarker(marker); }); }); } diff --git a/examples/point/chart/demo/ring.js b/examples/point/chart/demo/ring.js index 9dbad9079b..51a59854b8 100644 --- a/examples/point/chart/demo/ring.js +++ b/examples/point/chart/demo/ring.js @@ -44,69 +44,66 @@ const scene = new Scene({ zoom: 3.802 }) }); -scene.render(); -scene.on('loaded', () => { - Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/basement_prod/5b772136-a1f4-4fc5-9a80-9f9974b4b182.json' - ).then(d => d.json()), - fetch( - 'https://gw.alipayobjects.com/os/basement_prod/f3c467a4-9ae0-4f08-bb5f-11f9c869b2cb.json' - ).then(d => d.json()) - ]).then(function onLoad([ center, population ]) { - const popobj = {}; - population.forEach(element => { - popobj[element.Code] = - element['Population, female (% of total) (% of total)']; - }); - // 数据绑定 +Promise.all([ + fetch( + 'https://gw.alipayobjects.com/os/basement_prod/5b772136-a1f4-4fc5-9a80-9f9974b4b182.json' + ).then(d => d.json()), + fetch( + 'https://gw.alipayobjects.com/os/basement_prod/f3c467a4-9ae0-4f08-bb5f-11f9c869b2cb.json' + ).then(d => d.json()) +]).then(function onLoad([ center, population ]) { + const popobj = {}; + population.forEach(element => { + popobj[element.Code] = + element['Population, female (% of total) (% of total)']; + }); + // 数据绑定 - center.features = center.features.map(fe => { - fe.properties.female = popobj[fe.properties.id] * 1 || 0; - return fe; + center.features = center.features.map(fe => { + fe.properties.female = popobj[fe.properties.id] * 1 || 0; + return fe; + }); + center.features.forEach(point => { + const el = document.createElement('div'); + const coord = point.geometry.coordinates; + const v = point.properties.female * 1; + if (v < 1 || (v > 46 && v < 54)) { return; } + const size = 60; + const data = [ + { + type: '男性', + value: 100.0 - v.toFixed(2) + }, + { + type: '女性', + value: v.toFixed(2) * 1 + } + ]; + const chart = new G2.Chart({ + container: el, + width: size, + height: size, + render: 'svg', + padding: 0 }); - center.features.forEach(point => { - const el = document.createElement('div'); - const coord = point.geometry.coordinates; - const v = point.properties.female * 1; - if (v < 1 || (v > 46 && v < 54)) { return; } - const size = 60; - const data = [ - { - type: '男性', - value: 100.0 - v.toFixed(2) - }, - { - type: '女性', - value: v.toFixed(2) * 1 - } - ]; - const chart = new G2.Chart({ - container: el, - width: size, - height: size, - render: 'svg', - padding: 0 - }); - chart.source(data); - chart.legend(false); - chart.tooltip(false); - chart.coord('theta', { - radius: 0.9, - innerRadius: 0.6 - }); - chart - .intervalStack() - .position('value') - .color('type', [ '#5CCEA1', '#5B8FF9' ]) - .opacity(1); - chart.render(); - new Marker({ element: el }) - .setLnglat({ - lng: coord[0], - lat: coord[1] - }) - .addTo(scene); + chart.source(data); + chart.legend(false); + chart.tooltip(false); + chart.coord('theta', { + radius: 0.9, + innerRadius: 0.6 }); + chart + .intervalStack() + .position('value') + .color('type', [ '#5CCEA1', '#5B8FF9' ]) + .opacity(1); + chart.render(); + const marker = new Marker({ element: el }) + .setLnglat({ + lng: coord[0], + lat: coord[1] + }); + scene.addMarker(marker); }); }); diff --git a/examples/point/marker/demo/marker.js b/examples/point/marker/demo/marker.js index fa523846d8..7d3a074725 100644 --- a/examples/point/marker/demo/marker.js +++ b/examples/point/marker/demo/marker.js @@ -10,10 +10,9 @@ const scene = new Scene({ zoom: 4 }) }); +addMarkers(); scene.render(); -scene.on('loaded', () => { - addMarkers(); -}); + function addMarkers() { fetch( @@ -28,11 +27,11 @@ function addMarkers() { el.textContent = nodes[i].v + '℃'; el.style.background = getColor(nodes[i].v); el.style.borderColor = getColor(nodes[i].v); - new Marker({ + const marker = new Marker({ element: el }) - .setLnglat({ lng: nodes[i].x * 1, lat: nodes[i].y }) - .addTo(scene); + .setLnglat({ lng: nodes[i].x * 1, lat: nodes[i].y }); + scene.addMarker(marker); } }); } diff --git a/examples/tutorial/marker/demo/amap.js b/examples/tutorial/marker/demo/amap.js index 4c220d00df..c55ebbdf66 100644 --- a/examples/tutorial/marker/demo/amap.js +++ b/examples/tutorial/marker/demo/amap.js @@ -1,8 +1,8 @@ import { Scene, Marker, Popup } from '@antv/l7'; -import { GaodeMap } from '@antv/l7-maps'; +import { Mapbox } from '@antv/l7-maps'; const scene = new Scene({ id: 'map', - map: new GaodeMap({ + map: new Mapbox({ style: 'light', pitch: 0, center: [ 121.4316962, 31.26082325 ], diff --git a/packages/component/package.json b/packages/component/package.json index e72dd477f2..1a8afef44f 100644 --- a/packages/component/package.json +++ b/packages/component/package.json @@ -33,7 +33,7 @@ "inversify-logging": "^0.2.1", "load-styles": "^2.0.0" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/core/package.json b/packages/core/package.json index 9601a2ee6b..f8330a5b32 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -43,7 +43,7 @@ "@types/lodash": "^4.14.138", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/core/src/services/component/MarkerService.ts b/packages/core/src/services/component/MarkerService.ts index 6ae5995f26..e742bef00c 100644 --- a/packages/core/src/services/component/MarkerService.ts +++ b/packages/core/src/services/component/MarkerService.ts @@ -11,11 +11,11 @@ export default class MarkerService implements IMarkerService { private markers: IMarker[] = []; private unAddMarkers: IMarker[] = []; public addMarker(marker: IMarker): void { - if (!this.mapsService.map) { - this.unAddMarkers.push(marker); - } else { + if (!this.mapsService.map && this.mapsService.getMarkerContainer()) { this.markers.push(marker); marker.addTo(this.scene); + } else { + this.unAddMarkers.push(marker); } } public addMarkers(): void { diff --git a/packages/l7/package.json b/packages/l7/package.json index fbb87b80d8..b93513b30d 100644 --- a/packages/l7/package.json +++ b/packages/l7/package.json @@ -29,7 +29,7 @@ "@antv/l7-maps": "^2.0.0-beta.11", "@antv/l7-scene": "^2.0.0-beta.11" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/layers/package.json b/packages/layers/package.json index 5ab0c52995..fc97fc78fa 100644 --- a/packages/layers/package.json +++ b/packages/layers/package.json @@ -49,7 +49,7 @@ "@types/gl-matrix": "^2.4.5", "@types/lodash": "^4.14.138" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/maps/package.json b/packages/maps/package.json index e528a8e8cd..1473aea64d 100644 --- a/packages/maps/package.json +++ b/packages/maps/package.json @@ -36,7 +36,7 @@ "@types/mapbox-gl": "^0.54.3", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/renderer/package.json b/packages/renderer/package.json index a63817bbb0..847b189315 100644 --- a/packages/renderer/package.json +++ b/packages/renderer/package.json @@ -30,7 +30,7 @@ "reflect-metadata": "^0.1.13", "regl": "^1.3.11" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/scene/package.json b/packages/scene/package.json index 9e3b2e45db..957031de1e 100644 --- a/packages/scene/package.json +++ b/packages/scene/package.json @@ -32,7 +32,7 @@ "mapbox-gl": "^1.2.1", "reflect-metadata": "^0.1.13" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/source/package.json b/packages/source/package.json index a2a8e1a927..b8ab49364e 100644 --- a/packages/source/package.json +++ b/packages/source/package.json @@ -49,7 +49,7 @@ "@types/lodash": "^4.14.138", "@types/viewport-mercator-project": "^6.1.0" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/packages/utils/package.json b/packages/utils/package.json index 915840d87c..dfc781ba1f 100644 --- a/packages/utils/package.json +++ b/packages/utils/package.json @@ -36,7 +36,7 @@ "@types/gl-matrix": "^2.4.5", "@types/lodash": "^4.14.138" }, - "gitHead": "b1c276cf31af546141b35a2b7e13e8d290f2f300", + "gitHead": "5360c93be63ef4d8d580ca9fafd8fb05cb5fbe30", "publishConfig": { "access": "public" } diff --git a/stories/Components/components/Marker.tsx b/stories/Components/components/Marker.tsx index fc99f2d652..790280109b 100644 --- a/stories/Components/components/Marker.tsx +++ b/stories/Components/components/Marker.tsx @@ -1,6 +1,6 @@ // @ts-ignore import { Marker, PolygonLayer, Scene } from '@antv/l7'; -import { Mapbox } from '@antv/l7-maps'; +import { Mapbox, GaodeMap } from '@antv/l7-maps'; import * as React from 'react'; export default class MarkerComponent extends React.Component { @@ -18,7 +18,7 @@ export default class MarkerComponent extends React.Component { const scene = new Scene({ id: 'map', map: new Mapbox({ - style: 'mapbox://styles/mapbox/streets-v9', + style: 'dark', center: [110.19382669582967, 30.258134], pitch: 0, zoom: 3, @@ -43,14 +43,12 @@ export default class MarkerComponent extends React.Component { opacity: 0.3, }); scene.addLayer(layer); - scene.on('loaded', () => { - new Marker() - .setLnglat({ - lng: 120.19382669582967, - lat: 30.258134, - }) - .addTo(scene); + const marker = new Marker().setLnglat({ + lng: 120.19382669582967, + lat: 30.258134, }); + + scene.addMarker(marker); } public render() { diff --git a/stories/Components/components/Popup.tsx b/stories/Components/components/Popup.tsx index 4863381c90..0fc5175c85 100644 --- a/stories/Components/components/Popup.tsx +++ b/stories/Components/components/Popup.tsx @@ -43,17 +43,16 @@ export default class PopupComponent extends React.Component { opacity: 0.3, }); scene.addLayer(layer); - scene.on('loaded', () => { - new Popup({ - offsets: [0, 20], + const popup = new Popup({ + offsets: [0, 20], + }) + .setLnglat({ + lng: 120.19382669582967, + lat: 30.258134, }) - .setLnglat({ - lng: 120.19382669582967, - lat: 30.258134, - }) - .setText('hello') - .addTo(scene); - }); + .setText('hello'); + scene.addPopup(popup); + } public render() { diff --git a/stories/Components/components/Scale.tsx b/stories/Components/components/Scale.tsx index e9893ee812..dcc52eebb6 100644 --- a/stories/Components/components/Scale.tsx +++ b/stories/Components/components/Scale.tsx @@ -43,10 +43,9 @@ export default class ScaleComponent extends React.Component { opacity: 0.3, }); scene.addLayer(layer); - scene.on('loaded', () => { - const scaleControl = new Scale(); - scene.addControl(scaleControl); - }); + + const scaleControl = new Scale(); + scene.addControl(scaleControl); } public render() { diff --git a/stories/Components/components/Zoom.tsx b/stories/Components/components/Zoom.tsx index b749f9954c..098f2ff798 100644 --- a/stories/Components/components/Zoom.tsx +++ b/stories/Components/components/Zoom.tsx @@ -44,12 +44,10 @@ export default class ZoomComponent extends React.Component { opacity: 0.3, }); scene.addLayer(layer); - scene.on('loaded', () => { - const zoomControl = new Zoom({ - position: 'bottomright', - }); - scene.addControl(zoomControl); + const zoomControl = new Zoom({ + position: 'bottomright', }); + scene.addControl(zoomControl); } public render() { From 1a6068c93f63346df9ad1ce55ea3cbce299d6d7d Mon Sep 17 00:00:00 2001 From: thinkinggis Date: Thu, 28 Nov 2019 17:49:04 +0800 Subject: [PATCH 3/3] docs(tutorial): map init document --- docs/api/layer/layer.en.md | 4 +-- docs/api/layer/layer.zh.md | 4 +-- docs/tutorial/map/mapbox.zh.md | 30 ++++++++++++--------- docs/tutorial/quickstart.en.md | 48 +++++++++++++++++++++++++++++++--- docs/tutorial/quickstart.zh.md | 45 +++++++++++++++++++++++++++++-- 5 files changed, 109 insertions(+), 22 deletions(-) diff --git a/docs/api/layer/layer.en.md b/docs/api/layer/layer.en.md index 21ccab7477..cf80d00331 100644 --- a/docs/api/layer/layer.en.md +++ b/docs/api/layer/layer.en.md @@ -40,7 +40,7 @@ new Layer(option) ## 鼠标事件 -beta版当前不支持,正式版会支持 +⚠️ beta版当前不支持,正式版会支持 ```javascript layer.on('click', (ev)=>{}); // 鼠标左键点击图层事件 @@ -319,4 +319,4 @@ layer.hide(); ```javascript layer.fitBounds() -``` \ No newline at end of file +``` diff --git a/docs/api/layer/layer.zh.md b/docs/api/layer/layer.zh.md index dfefab69a6..05f63ab333 100644 --- a/docs/api/layer/layer.zh.md +++ b/docs/api/layer/layer.zh.md @@ -40,7 +40,7 @@ new Layer(option) ## 鼠标事件 -beta版当前不支持,正式版会支持 +⚠️ beta版当前不支持,正式版会支持 ```javascript layer.on('click', (ev)=>{}); // 鼠标左键点击图层事件 @@ -319,4 +319,4 @@ layer.hide(); ```javascript layer.fitBounds() -``` \ No newline at end of file +``` diff --git a/docs/tutorial/map/mapbox.zh.md b/docs/tutorial/map/mapbox.zh.md index 2e3788536c..2e8908adaf 100644 --- a/docs/tutorial/map/mapbox.zh.md +++ b/docs/tutorial/map/mapbox.zh.md @@ -39,18 +39,21 @@ order: 0 ### 初始化 L7 Scene +``` javascript + ``` javascript const scene = new L7.Scene({ id: 'map', - style: 'dark', // 样式URL - center: [120.19382669582967, 30.258134], - pitch: 0, - zoom: 12, - type:'mapbox', - token: 'mapbox token' - + map: new L7.Mapbox({ + style: 'dark', // 样式URL + center: [120.19382669582967, 30.258134], + pitch: 0, + zoom: 12, + token: 'mapbox token', + }), }); + ``` 这样我们就完成了通过L7 实例化mapbox地图 @@ -116,12 +119,13 @@ fetch('https://gw.alipayobjects.com/os/rmsportal/oVTMqfzuuRFKiDwhPSFL.json')