diff --git a/packages/site/examples/choropleth/administrative/demo/administrative-switch.tsx b/packages/site/examples/choropleth/administrative/delete/administrative-switch.tsx similarity index 93% rename from packages/site/examples/choropleth/administrative/demo/administrative-switch.tsx rename to packages/site/examples/choropleth/administrative/delete/administrative-switch.tsx index 80bcff763d..84eb70700f 100644 --- a/packages/site/examples/choropleth/administrative/demo/administrative-switch.tsx +++ b/packages/site/examples/choropleth/administrative/delete/administrative-switch.tsx @@ -161,3 +161,12 @@ function AdministrativeSwitch() { } ReactDOM.render(, document.getElementById('map')); + + // { + // "filename": "administrative-switch.tsx", + // "title": { + // "zh": "行政区域切换", + // "en": "Administrative Switch" + // }, + // "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/qSFaP32j8q/4428acf4-9362-4705-90c9-de950be5a177.png" + // } \ No newline at end of file diff --git a/packages/site/examples/choropleth/administrative/demo/china-city.ts b/packages/site/examples/choropleth/administrative/delete/china-city.ts similarity index 88% rename from packages/site/examples/choropleth/administrative/demo/china-city.ts rename to packages/site/examples/choropleth/administrative/delete/china-city.ts index b88fd762aa..9411d5a960 100644 --- a/packages/site/examples/choropleth/administrative/demo/china-city.ts +++ b/packages/site/examples/choropleth/administrative/delete/china-city.ts @@ -76,3 +76,12 @@ scene.on('loaded', () => { choropleth.addToScene(scene); }); }); + +// { +// "filename": "china-city.ts", +// "title": { +// "zh": "中国市级地图", +// "en": "China Citys Map" +// }, +// "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/GN35RftkmZ/c53bc5ab-189f-42a2-9288-7b34f616f18d.png" +// }, \ No newline at end of file diff --git a/packages/site/examples/choropleth/administrative/demo/china-map.ts b/packages/site/examples/choropleth/administrative/delete/china-map.ts similarity index 87% rename from packages/site/examples/choropleth/administrative/demo/china-map.ts rename to packages/site/examples/choropleth/administrative/delete/china-map.ts index d0a5037e19..9a84b60e18 100644 --- a/packages/site/examples/choropleth/administrative/demo/china-map.ts +++ b/packages/site/examples/choropleth/administrative/delete/china-map.ts @@ -70,3 +70,12 @@ scene.on('loaded', () => { choropleth.addToScene(scene); }); }); + +// { +// "filename": "china-map.ts", +// "title": { +// "zh": "中国地图", +// "en": "China Map" +// }, +// "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/qSFaP32j8q/4428acf4-9362-4705-90c9-de950be5a177.png" +// }, \ No newline at end of file diff --git a/packages/site/examples/choropleth/administrative/demo/world-map.ts b/packages/site/examples/choropleth/administrative/delete/world-map.ts similarity index 83% rename from packages/site/examples/choropleth/administrative/demo/world-map.ts rename to packages/site/examples/choropleth/administrative/delete/world-map.ts index e94944c9ba..3108128266 100644 --- a/packages/site/examples/choropleth/administrative/demo/world-map.ts +++ b/packages/site/examples/choropleth/administrative/delete/world-map.ts @@ -69,3 +69,12 @@ const choropleth = new Choropleth({ scene.on('loaded', () => { choropleth.addToScene(scene); }); + +// { +// "filename": "world-map.ts", +// "title": { +// "zh": "世界地图", +// "en": "World Map" +// }, +// "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/2W6xl7Y3wm/e7590fc4-f49b-43c0-ba3b-8b40a9ac3b39.png" +// }, \ No newline at end of file diff --git a/packages/site/examples/choropleth/administrative/demo/meta.json b/packages/site/examples/choropleth/administrative/demo/meta.json index 05a4d8ebf9..8fbfafa6ba 100644 --- a/packages/site/examples/choropleth/administrative/demo/meta.json +++ b/packages/site/examples/choropleth/administrative/demo/meta.json @@ -4,30 +4,7 @@ "en": "Category" }, "demos": [ - { - "filename": "world-map.ts", - "title": { - "zh": "世界地图", - "en": "World Map" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/2W6xl7Y3wm/e7590fc4-f49b-43c0-ba3b-8b40a9ac3b39.png" - }, - { - "filename": "china-map.ts", - "title": { - "zh": "中国地图", - "en": "China Map" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/qSFaP32j8q/4428acf4-9362-4705-90c9-de950be5a177.png" - }, - { - "filename": "china-city.ts", - "title": { - "zh": "中国市级地图", - "en": "China Citys Map" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/GN35RftkmZ/c53bc5ab-189f-42a2-9288-7b34f616f18d.png" - }, + { "filename": "zhejiang-province.ts", "title": { @@ -59,14 +36,6 @@ "en": "Xihu District Map" }, "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/04xm5U4yvt/828e6055-f005-4dba-8936-aaf451487db9.png" - }, - { - "filename": "administrative-switch.tsx", - "title": { - "zh": "行政区域切换", - "en": "Administrative Switch" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/qSFaP32j8q/4428acf4-9362-4705-90c9-de950be5a177.png" } ] } diff --git a/packages/site/examples/choropleth/drill/API.en.md b/packages/site/examples/choropleth/drill/API.en.md deleted file mode 100644 index 03135ec6f6..0000000000 --- a/packages/site/examples/choropleth/drill/API.en.md +++ /dev/null @@ -1 +0,0 @@ -`markdown:docs/common/district/choropleth.zh.md` diff --git a/packages/site/examples/choropleth/drill/API.zh.md b/packages/site/examples/choropleth/drill/API.zh.md deleted file mode 100644 index 03135ec6f6..0000000000 --- a/packages/site/examples/choropleth/drill/API.zh.md +++ /dev/null @@ -1 +0,0 @@ -`markdown:docs/common/district/choropleth.zh.md` diff --git a/packages/site/examples/choropleth/drill/demo/drill-callback.ts b/packages/site/examples/choropleth/drill/demo/drill-callback.ts deleted file mode 100644 index 6893687505..0000000000 --- a/packages/site/examples/choropleth/drill/demo/drill-callback.ts +++ /dev/null @@ -1,124 +0,0 @@ -import { Mapbox, Scene } from '@antv/l7'; -import { Choropleth } from '@antv/l7plot'; - -const scene = new Scene({ - id: 'map', - map: new Mapbox({ - style: 'blank', - center: [120.19382669582967, 30.258134], - zoom: 3, - pitch: 0, - }), -}); - -fetch( - 'https://gw.alipayobjects.com/os/alisis/geo-data-v0.1.1/administrative-data/area-list.json', -) - .then((response) => response.json()) - .then((list) => { - const data = list - .filter(({ level }) => level === 'province') - .map((item) => ({ ...item, value: Math.random() * 5000 })); - - const cityData = list - .filter(({ level }) => level === 'city') - .map((item) => ({ ...item, value: Math.random() * 2000 })); - - const districtData = list - .filter(({ level }) => level === 'district') - .map((item) => ({ ...item, value: Math.random() * 1000 })); - - const choropleth = new Choropleth({ - source: { - data, - joinBy: { - sourceField: 'adcode', - geoField: 'adcode', - }, - }, - viewLevel: { - level: 'country', - adcode: 100000, - }, - autoFit: true, - drill: { - steps: ['province', 'city'], - triggerUp: 'unclick', - triggerDown: 'click', - onDown: (from, to, callback) => { - const { level, granularity } = to; - if (granularity === 'city') { - callback({ - source: { data: cityData, joinBy: { sourceField: 'adcode' } }, - }); - } else if (granularity === 'district') { - callback({ - source: { data: districtData, joinBy: { sourceField: 'adcode' } }, - }); - } - }, - onUp: (from, to, callback) => { - callback(); - }, - }, - color: { - field: 'value', - value: ['#B8E1FF', '#7DAAFF', '#3D76DD', '#0047A5', '#001D70'], - scale: { type: 'quantize' }, - }, - style: { - opacity: 1, - stroke: '#ccc', - lineWidth: 0.6, - lineOpacity: 1, - }, - chinaBorder: { - // 国界 - national: { color: '#ccc', width: 1, opacity: 1 }, - // 争议 - dispute: { - color: '#ccc', - width: 1, - opacity: 0.8, - dashArray: [2, 2], - }, - // 海洋 - coast: { color: '#ccc', width: 0.7, opacity: 0.8 }, - // 港澳 - hkm: { color: 'gray', width: 0.7, opacity: 0.8 }, - }, - label: { - visible: true, - field: 'name', - style: { - fill: '#000', - opacity: 0.8, - fontSize: 10, - stroke: '#fff', - strokeWidth: 1.5, - textAllowOverlap: false, - padding: [5, 5], - }, - }, - state: { - active: { stroke: 'black', lineWidth: 1 }, - }, - tooltip: { - items: ['name', 'adcode', 'value'], - }, - zoom: { - position: 'bottomright', - }, - legend: { - position: 'bottomleft', - }, - }); - - if (scene.loaded) { - choropleth.addToScene(scene); - } else { - scene.on('loaded', () => { - choropleth.addToScene(scene); - }); - } - }); diff --git a/packages/site/examples/choropleth/drill/demo/drill-intercept.ts b/packages/site/examples/choropleth/drill/demo/drill-intercept.ts deleted file mode 100644 index 26efdaa2af..0000000000 --- a/packages/site/examples/choropleth/drill/demo/drill-intercept.ts +++ /dev/null @@ -1,114 +0,0 @@ -import { Mapbox, Scene } from '@antv/l7'; -import { Choropleth } from '@antv/l7plot'; - -const scene = new Scene({ - id: 'map', - map: new Mapbox({ - style: 'blank', - center: [120.19382669582967, 30.258134], - zoom: 3, - pitch: 0, - }), -}); - -fetch( - 'https://gw.alipayobjects.com/os/alisis/geo-data-v0.1.1/administrative-data/area-list.json', -) - .then((response) => response.json()) - .then((list) => { - const data = list - .filter(({ level }) => level === 'province') - .map((item) => ({ ...item, value: Math.random() * 5000 })); - - const cityData = list - .filter(({ level }) => level === 'city') - .map((item) => ({ ...item, value: Math.random() * 2000 })); - - const districtData = list - .filter(({ level }) => level === 'district') - .map((item) => ({ ...item, value: Math.random() * 1000 })); - - const choropleth = new Choropleth({ - source: { - data, - joinBy: { - sourceField: 'adcode', - geoField: 'adcode', - }, - }, - viewLevel: { - level: 'country', - adcode: 100000, - }, - autoFit: true, - drill: { - steps: ['province', 'city'], - triggerUp: 'unclick', - triggerDown: 'click', - onDown: (from, to, callback) => { - const { adcode, level, granularity } = to; - // 如果是浙江省，禁止下钻 - if (adcode === 330000) { - return; - } - - if (granularity === 'city') { - callback({ - source: { data: cityData, joinBy: { sourceField: 'adcode' } }, - }); - } else if (granularity === 'district') { - callback({ - source: { data: districtData, joinBy: { sourceField: 'adcode' } }, - }); - } - }, - onUp: (from, to, callback) => { - callback(); - }, - }, - color: { - field: 'value', - value: ['#B8E1FF', '#7DAAFF', '#3D76DD', '#0047A5', '#001D70'], - scale: { type: 'quantize' }, - }, - style: { - opacity: 1, - stroke: '#ccc', - lineWidth: 0.6, - lineOpacity: 1, - }, - label: { - visible: true, - field: 'name', - style: { - fill: '#000', - opacity: 0.8, - fontSize: 10, - stroke: '#fff', - strokeWidth: 1.5, - textAllowOverlap: false, - padding: [5, 5], - }, - }, - state: { - active: { stroke: 'black', lineWidth: 1 }, - }, - tooltip: { - items: ['name', 'adcode', 'value'], - }, - zoom: { - position: 'bottomright', - }, - legend: { - position: 'bottomleft', - }, - }); - - if (scene.loaded) { - choropleth.addToScene(scene); - } else { - scene.on('loaded', () => { - choropleth.addToScene(scene); - }); - } - }); diff --git a/packages/site/examples/choropleth/drill/demo/meta.json b/packages/site/examples/choropleth/drill/demo/meta.json deleted file mode 100644 index aa7f7b4ff9..0000000000 --- a/packages/site/examples/choropleth/drill/demo/meta.json +++ /dev/null @@ -1,40 +0,0 @@ -{ - "title": { - "zh": "分类", - "en": "Category" - }, - "demos": [ - { - "filename": "order-drill.ts", - "title": { - "zh": "省市区下钻", - "en": "Order Drill" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/ftd%248FdI08/zuanqu.gif" - }, - { - "filename": "unorder-drill.ts", - "title": { - "zh": "跨粒度下钻", - "en": "Unorder Drill" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/w4VwQsFCgy/zuanqu.gif" - }, - { - "filename": "drill-callback.ts", - "title": { - "zh": "下钻回调", - "en": "Drill Callback" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/kNXBgAN4%26Z/zuanqu2.gif" - }, - { - "filename": "drill-intercept.ts", - "title": { - "zh": "下钻拦截", - "en": "Drill Intercept" - }, - "screenshot": "https://gw.alipayobjects.com/zos/antfincdn/rftSqwzjdj/zuanqu3.gif" - } - ] -} diff --git a/packages/site/examples/choropleth/drill/demo/order-drill.ts b/packages/site/examples/choropleth/drill/demo/order-drill.ts deleted file mode 100644 index 1fe161f1d5..0000000000 --- a/packages/site/examples/choropleth/drill/demo/order-drill.ts +++ /dev/null @@ -1,109 +0,0 @@ -import { Mapbox, Scene } from '@antv/l7'; -import { Choropleth } from '@antv/l7plot'; - -const scene = new Scene({ - id: 'map', - map: new Mapbox({ - style: 'blank', - center: [120.19382669582967, 30.258134], - zoom: 3, - pitch: 0, - }), -}); - -fetch( - 'https://gw.alipayobjects.com/os/alisis/geo-data-v0.1.1/administrative-data/area-list.json', -) - .then((response) => response.json()) - .then((list) => { - const data = list - .filter(({ level }) => level === 'province') - .map((item) => ({ ...item, value: Math.random() * 5000 })); - - const cityData = list - .filter(({ level }) => level === 'city') - .map((item) => ({ ...item, value: Math.random() * 2000 })); - - const districtData = list - .filter(({ level }) => level === 'district') - .map((item) => ({ ...item, value: Math.random() * 1000 })); - - const choropleth = new Choropleth({ - source: { - data, - joinBy: { - sourceField: 'adcode', - geoField: 'adcode', - }, - }, - viewLevel: { - level: 'country', - adcode: 100000, - }, - autoFit: true, - drill: { - steps: [ - { - level: 'province', - source: { data: cityData }, - }, - { - level: 'city', - source: { data: districtData }, - }, - { - level: 'district', - source: { data: districtData }, - // color: 'green', - // style: { opacity: 0.5 }, - }, - ], - triggerUp: 'unclick', - triggerDown: 'click', - }, - color: { - field: 'value', - value: ['#B8E1FF', '#7DAAFF', '#3D76DD', '#0047A5', '#001D70'], - scale: { type: 'quantize' }, - }, - style: { - opacity: 1, - stroke: '#ccc', - lineWidth: 0.6, - lineOpacity: 1, - }, - label: { - visible: true, - field: 'name', - style: { - fill: '#000', - opacity: 0.8, - fontSize: 10, - stroke: '#fff', - strokeWidth: 1.5, - textAllowOverlap: false, - padding: [5, 5], - }, - }, - state: { - active: { stroke: 'black', lineWidth: 1 }, - }, - tooltip: { - items: ['name', 'adcode', 'value'], - }, - zoom: { - position: 'bottomright', - }, - legend: { - position: 'bottomleft', - }, - }); - - if (scene.loaded) { - choropleth.addToScene(scene); - } else { - scene.on('loaded', () => { - choropleth.addToScene(scene); - }); - } - }); diff --git a/packages/site/examples/choropleth/drill/demo/unorder-drill.ts b/packages/site/examples/choropleth/drill/demo/unorder-drill.ts deleted file mode 100644 index 644aad8986..0000000000 --- a/packages/site/examples/choropleth/drill/demo/unorder-drill.ts +++ /dev/null @@ -1,102 +0,0 @@ -import { Mapbox, Scene } from '@antv/l7'; -import { Choropleth } from '@antv/l7plot'; - -const scene = new Scene({ - id: 'map', - map: new Mapbox({ - style: 'blank', - center: [120.19382669582967, 30.258134], - zoom: 3, - pitch: 0, - }), -}); - -fetch( - 'https://gw.alipayobjects.com/os/alisis/geo-data-v0.1.1/administrative-data/area-list.json', -) - .then((response) => response.json()) - .then((list) => { - const data = list - .filter(({ level }) => level === 'province') - .map((item) => ({ ...item, value: Math.random() * 5000 })); - - const districtData = list - .filter(({ level }) => level === 'district') - .map((item) => ({ ...item, value: Math.random() * 1000 })); - - const choropleth = new Choropleth({ - source: { - data, - joinBy: { - sourceField: 'adcode', - geoField: 'adcode', - }, - }, - viewLevel: { - level: 'country', - adcode: 100000, - }, - autoFit: true, - drill: { - steps: [ - { - level: 'province', - granularity: 'district', - source: { data: districtData }, - }, - { - level: 'district', - source: { data: districtData }, - // color: 'green', - // style: { opacity: 0.5 }, - }, - ], - triggerUp: 'unclick', - triggerDown: 'click', - }, - color: { - field: 'value', - value: ['#B8E1FF', '#7DAAFF', '#3D76DD', '#0047A5', '#001D70'], - scale: { type: 'quantize' }, - }, - style: { - opacity: 1, - stroke: '#ccc', - lineWidth: 0.6, - lineOpacity: 1, - }, - label: { - visible: true, - field: 'name', - style: { - fill: '#000', - opacity: 0.8, - fontSize: 10, - stroke: '#fff', - strokeWidth: 1.5, - textAllowOverlap: false, - padding: [5, 5], - }, - }, - state: { - active: { stroke: 'black', lineWidth: 1 }, - }, - tooltip: { - items: ['name', 'adcode', 'value'], - }, - zoom: { - position: 'bottomright', - }, - legend: { - position: 'bottomleft', - }, - }); - - if (scene.loaded) { - choropleth.addToScene(scene); - } else { - scene.on('loaded', () => { - choropleth.addToScene(scene); - }); - } - }); diff --git a/packages/site/examples/choropleth/drill/index.en.md b/packages/site/examples/choropleth/drill/index.en.md deleted file mode 100644 index 558ba2df53..0000000000 --- a/packages/site/examples/choropleth/drill/index.en.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -title: Drill down -order: 1 ---- diff --git a/packages/site/examples/choropleth/drill/index.zh.md b/packages/site/examples/choropleth/drill/index.zh.md deleted file mode 100644 index fe88feab2d..0000000000 --- a/packages/site/examples/choropleth/drill/index.zh.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -title: 区域钻取 -order: 1 ---- diff --git a/packages/site/examples/gallery/animate/demo/amap_car.js b/packages/site/examples/gallery/animate/delete/amap_car.js similarity index 97% rename from packages/site/examples/gallery/animate/demo/amap_car.js rename to packages/site/examples/gallery/animate/delete/amap_car.js index 5c5f0f9a50..c2544364cc 100644 --- a/packages/site/examples/gallery/animate/demo/amap_car.js +++ b/packages/site/examples/gallery/animate/delete/amap_car.js @@ -242,3 +242,10 @@ function setMaterial(object) { object.material.side = THREE.DoubleSide; } } + + +// { +// "filename": "amap_car.js", +// "title": "旅行轨迹", +// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ghmURqau13sAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/gallery/animate/demo/box_select.js b/packages/site/examples/gallery/animate/delete/box_select.js similarity index 95% rename from packages/site/examples/gallery/animate/demo/box_select.js rename to packages/site/examples/gallery/animate/delete/box_select.js index 8674bef939..aaf279a11c 100644 --- a/packages/site/examples/gallery/animate/demo/box_select.js +++ b/packages/site/examples/gallery/animate/delete/box_select.js @@ -148,3 +148,8 @@ scene.on('loaded', () => { }); }); +// { +// "filename": "box_select.js", +// "title": "框选要素", +// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*G1lyQ6e5gKAAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/gallery/animate/demo/plane_animate.js b/packages/site/examples/gallery/animate/delete/plane_animate.js similarity index 95% rename from packages/site/examples/gallery/animate/demo/plane_animate.js rename to packages/site/examples/gallery/animate/delete/plane_animate.js index d12ac80b5e..43f58b2043 100644 --- a/packages/site/examples/gallery/animate/demo/plane_animate.js +++ b/packages/site/examples/gallery/animate/delete/plane_animate.js @@ -139,3 +139,9 @@ scene.on('loaded', () => { scene.addLayer(flyLine); }); }); + +// { +// "filename": "plane_animate.js", +// "title": "航向图", +// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*8h-QSqDgzxYAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/gallery/animate/demo/route_line.js b/packages/site/examples/gallery/animate/delete/route_line.js similarity index 95% rename from packages/site/examples/gallery/animate/demo/route_line.js rename to packages/site/examples/gallery/animate/delete/route_line.js index 10904f5530..b075375c93 100644 --- a/packages/site/examples/gallery/animate/demo/route_line.js +++ b/packages/site/examples/gallery/animate/delete/route_line.js @@ -186,3 +186,9 @@ scene.on('loaded', () => { scene.addLayer(layerPlaneLine); }); }); + +// { +// "filename": "route_line.js", +// "title": "航线图", +// "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*NEKUR6HzXFEAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/gallery/animate/demo/meta.json b/packages/site/examples/gallery/animate/demo/meta.json index e2f2c57407..8f406534d3 100644 --- a/packages/site/examples/gallery/animate/demo/meta.json +++ b/packages/site/examples/gallery/animate/demo/meta.json @@ -19,36 +19,17 @@ "title": "风场图层", "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*K6NHRL_fjTQAAAAAAAAAAAAAARQnAQ" }, - { - "filename": "amap_car.js", - "title": "旅行轨迹", - "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*ghmURqau13sAAAAAAAAAAAAAARQnAQ" - }, + { "filename": "animate_path_texture.js", "title": "路径贴图", "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*0DwvSIHihVEAAAAAAAAAAAAAARQnAQ" }, - { - "filename": "plane_animate.js", - "title": "航向图", - "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*8h-QSqDgzxYAAAAAAAAAAAAAARQnAQ" - }, { "filename": "turin.js", "title": "都灵道路图", "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*P1o6R7jm0JsAAAAAAAAAAAAAARQnAQ" }, - { - "filename": "route_line.js", - "title": "航线图", - "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*NEKUR6HzXFEAAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "box_select.js", - "title": "框选要素", - "screenshot":"https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*G1lyQ6e5gKAAAAAAAAAAAAAAARQnAQ" - }, { "filename": "timeline.js", "title": "公交站点时序数据", diff --git a/packages/site/examples/polygon/3d/demo/meta.json b/packages/site/examples/polygon/3d/demo/meta.json index b9e4373fcf..019c387d64 100644 --- a/packages/site/examples/polygon/3d/demo/meta.json +++ b/packages/site/examples/polygon/3d/demo/meta.json @@ -18,11 +18,6 @@ "filename": "floatMap.js", "title": "漂浮地图板块", "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*D8GeSKNZxWIAAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "texture3D.js", - "title": "手绘地图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*K18EQZoe4awAAAAAAAAAAAAAARQnAQ" } ] } diff --git a/packages/site/examples/polygon/fill/demo/china_linear_in.js b/packages/site/examples/polygon/delete/china_linear_in.js similarity index 87% rename from packages/site/examples/polygon/fill/demo/china_linear_in.js rename to packages/site/examples/polygon/delete/china_linear_in.js index 1c2b7d2964..5481c0fba8 100644 --- a/packages/site/examples/polygon/fill/demo/china_linear_in.js +++ b/packages/site/examples/polygon/delete/china_linear_in.js @@ -57,3 +57,8 @@ scene.on('loaded', () => { scene.addLayer(layer2); }); }); +// { +// "filename": "china_linear_in.js", +// "title": "中国地图-径向渐变", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*SgKRRKJ1w-EAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/polygon/fill/demo/city.js b/packages/site/examples/polygon/delete/city.js similarity index 91% rename from packages/site/examples/polygon/fill/demo/city.js rename to packages/site/examples/polygon/delete/city.js index 1f0a5b07cb..ce1146704a 100644 --- a/packages/site/examples/polygon/fill/demo/city.js +++ b/packages/site/examples/polygon/delete/city.js @@ -87,3 +87,9 @@ scene.on('loaded', () => { scene.addLayer(labelLayer); }); }); + +// { +// "filename": "city.js", +// "title": "中国地图市级", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*I-dVQ4kzmmoAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/polygon/fill/demo/province.js b/packages/site/examples/polygon/delete/province.js similarity index 91% rename from packages/site/examples/polygon/fill/demo/province.js rename to packages/site/examples/polygon/delete/province.js index c4df27a7ff..9bd86eeb71 100644 --- a/packages/site/examples/polygon/fill/demo/province.js +++ b/packages/site/examples/polygon/delete/province.js @@ -77,3 +77,9 @@ scene.on('loaded', () => { scene.addLayer(labelLayer); }); }); + +// { +// "filename": "province.js", +// "title": "中国地图省级", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*i02qTq1C1IYAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/polygon/3d/demo/texture3D.js b/packages/site/examples/polygon/delete/texture3D.js similarity index 83% rename from packages/site/examples/polygon/3d/demo/texture3D.js rename to packages/site/examples/polygon/delete/texture3D.js index 348b60cb77..2929bef012 100644 --- a/packages/site/examples/polygon/3d/demo/texture3D.js +++ b/packages/site/examples/polygon/delete/texture3D.js @@ -32,3 +32,9 @@ scene.on('loaded', () => { scene.addLayer(provincelayer); }); }); + +// { +// "filename": "texture3D.js", +// "title": "手绘地图", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*K18EQZoe4awAAAAAAAAAAAAAARQnAQ" +// } \ No newline at end of file diff --git a/packages/site/examples/polygon/fill/demo/meta.json b/packages/site/examples/polygon/fill/demo/meta.json index 61326789bb..f322c28ba1 100644 --- a/packages/site/examples/polygon/fill/demo/meta.json +++ b/packages/site/examples/polygon/fill/demo/meta.json @@ -4,16 +4,6 @@ "en": "Category" }, "demos": [ - { - "filename": "province.js", - "title": "中国地图省级", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*i02qTq1C1IYAAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "city.js", - "title": "中国地图市级", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*I-dVQ4kzmmoAAAAAAAAAAAAAARQnAQ" - }, { "filename": "usa.js", "title": "地图交互", @@ -24,11 +14,6 @@ "title": "连续填充图", "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*t9QJRL7uVk4AAAAAAAAAAAAAARQnAQ" }, - { - "filename": "china_linear_in.js", - "title": "中国地图-径向渐变", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*SgKRRKJ1w-EAAAAAAAAAAAAAARQnAQ" - }, { "filename": "water.js", "title": "简单水面", diff --git a/packages/site/examples/raster/basic/demo/dem.js b/packages/site/examples/raster/basic/delete/dem.js similarity index 91% rename from packages/site/examples/raster/basic/demo/dem.js rename to packages/site/examples/raster/basic/delete/dem.js index 50c70fbd42..25dd197264 100644 --- a/packages/site/examples/raster/basic/demo/dem.js +++ b/packages/site/examples/raster/basic/delete/dem.js @@ -69,3 +69,9 @@ async function addLayer() { scene.addLayer(layer); } + +// { +// "filename": "dem.js", +// "title": "地形图", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*jhWWS6dhKhYAAAAAAAAAAAAAARQnAQ" +// }, \ No newline at end of file diff --git a/packages/site/examples/raster/basic/demo/ndvi.js b/packages/site/examples/raster/basic/delete/ndvi.js similarity index 91% rename from packages/site/examples/raster/basic/demo/ndvi.js rename to packages/site/examples/raster/basic/delete/ndvi.js index 85f3ae4f09..9dc5cdc4f5 100644 --- a/packages/site/examples/raster/basic/demo/ndvi.js +++ b/packages/site/examples/raster/basic/delete/ndvi.js @@ -65,3 +65,9 @@ async function addLayer() { scene.addLayer(layer); } + +// { +// "filename": "ndvi.js", +// "title": "NDVI", +// "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*lpWZQKaCu6cAAAAAAAAAAAAAARQnAQ" +// }, diff --git a/packages/site/examples/raster/basic/demo/meta.json b/packages/site/examples/raster/basic/demo/meta.json index efe7f58be9..37edc7bde0 100644 --- a/packages/site/examples/raster/basic/demo/meta.json +++ b/packages/site/examples/raster/basic/demo/meta.json @@ -10,21 +10,11 @@ "title": "雷达图", "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*JDO-R5XU7xwAAAAAAAAAAAAAARQnAQ" }, - { - "filename": "dem.js", - "title": "地形图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*jhWWS6dhKhYAAAAAAAAAAAAAARQnAQ" - }, { "filename": "light.js", "title": "夜光图", "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*xznhSJFEAXYAAAAAAAAAAAAAARQnAQ" }, - { - "filename": "ndvi.js", - "title": "NDVI", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*lpWZQKaCu6cAAAAAAAAAAAAAARQnAQ" - }, { "filename": "image.js", "title": "图片", diff --git a/packages/site/examples/react/covid/demo/covid_animate.tsx b/packages/site/examples/react/covid/demo/covid_animate.tsx deleted file mode 100644 index 6c6b0ae528..0000000000 --- a/packages/site/examples/react/covid/demo/covid_animate.tsx +++ /dev/null @@ -1,226 +0,0 @@ -import { - LayerEvent, - LineLayer, - MapboxScene, - Marker, - PointLayer, - PolygonLayer, - Popup, -} from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName: 0, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} - -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - const [filldata, setfillData] = React.useState(); - const [popupInfo, setPopupInfo] = React.useState<{ - lnglat: number[]; - feature: any; - }>(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - ]); - const worldData = joinData(geoData, ncovData.results); - const pointdata = worldData.features.map((feature: any) => { - return feature.properties; - }); - setfillData(worldData); - setData(pointdata); - }; - fetchData(); - }, []); - function showPopup(args: any): void { - setPopupInfo({ - lnglat: args.lngLat, - feature: args.feature, - }); - } - - return ( - <> - - {popupInfo && ( - - {popupInfo.feature.name} -
    -
  • 现有确诊:{popupInfo.feature.currentConfirmedCount}
    • -
  • 累计确诊:{popupInfo.feature.confirmedCount}
    • -
  • 治愈:{popupInfo.feature.curedCount}
    • -
  • 死亡:{popupInfo.feature.deadCount}
    • -
- - )} - {data && [ - , - , - - - , - ]} - - - ); -}); -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/covid_bubble.tsx b/packages/site/examples/react/covid/demo/covid_bubble.tsx deleted file mode 100644 index f32cbb5edc..0000000000 --- a/packages/site/examples/react/covid/demo/covid_bubble.tsx +++ /dev/null @@ -1,280 +0,0 @@ -import { - LayerEvent, - LineLayer, - MapboxScene, - Marker, - PointLayer, - PolygonLayer, - Popup, -} from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; -const colors = [ - '#732200', - '#CC3D00', - '#FF6619', - '#FF9466', - '#FFC1A6', - '#FCE2D7', - '#ffffff', -].reverse(); -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} - -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - const [filldata, setfillData] = React.useState(); - const [popupInfo, setPopupInfo] = React.useState<{ - lnglat: number[]; - feature: any; - }>(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - ]); - const worldData = joinData(geoData, ncovData.results); - const pointdata = worldData.features.map((feature: any) => { - return feature.properties; - }); - setfillData(worldData); - setData(pointdata); - }; - fetchData(); - }, []); - function showPopup(args: any): void { - setPopupInfo({ - lnglat: args.lngLat, - feature: args.feature, - }); - } - - return ( - <> - - {popupInfo && ( - - {popupInfo.feature.name} -
    -
  • 现有确诊:{popupInfo.feature.currentConfirmedCount}
    • -
  • 累计确诊:{popupInfo.feature.confirmedCount}
    • -
  • 治愈:{popupInfo.feature.curedCount}
    • -
  • 死亡:{popupInfo.feature.deadCount}
    • -
- - )} - {data && [ - , - , - { - return count > 10000 - ? colors[6] - : count > 1000 - ? colors[5] - : count > 500 - ? colors[4] - : count > 100 - ? colors[3] - : count > 10 - ? colors[2] - : count > 1 - ? colors[1] - : colors[0]; - }, - }} - shape={{ - values: 'circle', - }} - active={{ - option: { - color: '#0c2c84', - mix: 0.6, - }, - }} - size={{ - field: 'confirmedCount', - values: [0, 30], - }} - style={{ - opacity: 0.8, - }} - > - - , - { - return v > 500; - }, - }} - size={{ - values: 12, - }} - style={{ - opacity: 1, - strokeOpacity: 1, - strokeWidth: 0, - }} - > - - , - ]} - - - ); -}); -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/covid_column.tsx b/packages/site/examples/react/covid/demo/covid_column.tsx deleted file mode 100644 index f2803bd634..0000000000 --- a/packages/site/examples/react/covid/demo/covid_column.tsx +++ /dev/null @@ -1,225 +0,0 @@ -import { - LineLayer, - MapboxScene, - Marker, - PointLayer, - PolygonLayer, - Popup, -} from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName: 0, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - const [filldata, setfillData] = React.useState(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - ]); - const worldData = joinData(geoData, ncovData.results); - const pointdata = worldData.features.map((feature: any) => { - return feature.properties; - }); - setfillData(worldData); - setData(pointdata); - }; - fetchData(); - }, []); - return ( - <> - - {data && [ - , - , - { - return count > 10000 - ? '#732200' - : count > 1000 - ? '#CC3D00' - : count > 500 - ? '#FF6619' - : count > 100 - ? '#FF9466' - : count > 10 - ? '#FFC1A6' - : count > 1 - ? '#FCE2D7' - : 'rgb(255,255,255)'; - }, - }} - shape={{ - values: 'cylinder', - }} - size={{ - field: 'confirmedCount', - values: (count: number) => { - const height = - count > 10000 - ? 70 - : count > 1000 - ? 40 - : count > 500 - ? 30 - : count > 100 - ? 20 - : count > 10 - ? 10 - : count > 1 - ? 5 - : 1; - return [5, 5, height]; - }, - }} - style={{ - opacity: 1, - }} - />, - ]} - - - ); -}); - -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/covid_extrude.tsx b/packages/site/examples/react/covid/demo/covid_extrude.tsx deleted file mode 100644 index d63371f276..0000000000 --- a/packages/site/examples/react/covid/demo/covid_extrude.tsx +++ /dev/null @@ -1,151 +0,0 @@ -import { MapboxScene, PolygonLayer } from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName: 0, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} - -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - ]); - setData(joinData(geoData, ncovData.results)); - }; - fetchData(); - }, []); - return ( - <> - - {data && [ - { - return count > 10000 - ? '#732200' - : count > 1000 - ? '#CC3D00' - : count > 500 - ? '#FF6619' - : count > 100 - ? '#FF9466' - : count > 10 - ? '#FFC1A6' - : count > 1 - ? '#FCE2D7' - : 'rgb(255,255,255)'; - }, - }} - shape={{ - values: 'extrude', - }} - size={{ - field: 'confirmedCount', - values: [0, 1000000, 3000000, 4000000, 5000000], - }} - style={{ - opacity: 1, - pickLight: true, - heightfixed: true, - }} - />, - ]} - - - ); -}); -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/covid_fill.tsx b/packages/site/examples/react/covid/demo/covid_fill.tsx deleted file mode 100644 index b629d26dab..0000000000 --- a/packages/site/examples/react/covid/demo/covid_fill.tsx +++ /dev/null @@ -1,164 +0,0 @@ -import { - LineLayer, - MapboxScene, - Marker, - PolygonLayer, - Popup, -} from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; - -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName: 0, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} - -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - ]); - setData(joinData(geoData, ncovData.results)); - }; - fetchData(); - }, []); - return ( - <> - - {data && [ - , - , - ]} - - - ); -}); -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/covid_grid.tsx b/packages/site/examples/react/covid/demo/covid_grid.tsx deleted file mode 100644 index 478ba54564..0000000000 --- a/packages/site/examples/react/covid/demo/covid_grid.tsx +++ /dev/null @@ -1,234 +0,0 @@ -import { - HeatmapLayer, - LayerEvent, - LineLayer, - MapboxScene, - Marker, - PointLayer, - PolygonLayer, - Popup, -} from '@antv/l7-react'; -import * as React from 'react'; -import ReactDOM from 'react-dom'; -const colors = [ - '#f7fcf0', - '#e0f3db', - '#ccebc5', - '#a8ddb5', - '#7bccc4', - '#4eb3d3', - '#2b8cbe', - '#08589e', -].reverse(); -function joinData(geodata: any, ncovData: any) { - const ncovDataObj: any = {}; - ncovData.forEach((item: any) => { - const { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - } = item; - if (countryName === '中国') { - if (!ncovDataObj[countryName]) { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount: 0, - confirmedCount: 0, - suspectedCount: 0, - curedCount: 0, - deadCount: 0, - }; - } else { - ncovDataObj[countryName].currentConfirmedCount += currentConfirmedCount; - ncovDataObj[countryName].confirmedCount += confirmedCount; - ncovDataObj[countryName].suspectedCount += suspectedCount; - ncovDataObj[countryName].curedCount += curedCount; - ncovDataObj[countryName].deadCount += deadCount; - } - } else { - ncovDataObj[countryName] = { - countryName, - countryEnglishName, - currentConfirmedCount, - confirmedCount, - suspectedCount, - curedCount, - deadCount, - }; - } - }); - const geoObj: any = {}; - geodata.features.forEach((feature: any) => { - const { name } = feature.properties; - geoObj[name] = feature.properties; - const ncov = ncovDataObj[name] || {}; - feature.properties = { - ...feature.properties, - ...ncov, - }; - }); - return geodata; -} - -const World = React.memo(function Map() { - const [data, setData] = React.useState(); - const [filldata, setfillData] = React.useState(); - const [popupInfo, setPopupInfo] = React.useState<{ - lnglat: number[]; - feature: any; - }>(); - React.useEffect(() => { - const fetchData = async () => { - const [geoData, ncovData, gridData] = await Promise.all([ - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/e62a2f3b-ea99-4c98-9314-01d7c886263d.json', - ).then((d) => d.json()), - // https://lab.isaaclin.cn/nCoV/api/area?latest=1 - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/55a7dd2e-3fb4-4442-8899-900bb03ee67a.json', - ).then((d) => d.json()), - fetch( - 'https://gw.alipayobjects.com/os/bmw-prod/8990e8b4-c58e-419b-afb9-8ea3daff2dd1.json', - ).then((d) => d.json()), - ]); - const worldData = joinData(geoData, ncovData.results); - const pointdata = worldData.features.map((feature: any) => { - return feature.properties; - }); - setfillData(gridData); - setData(pointdata); - }; - fetchData(); - }, []); - function showPopup(args: any): void { - setPopupInfo({ - lnglat: args.lngLat, - feature: args.feature, - }); - } - - return ( - <> - - {popupInfo && ( - - {popupInfo.feature.name} -
    -
  • 现有确诊:{popupInfo.feature.currentConfirmedCount}
    • -
  • 累计确诊:{popupInfo.feature.confirmedCount}
    • -
  • 治愈:{popupInfo.feature.curedCount}
    • -
  • 死亡:{popupInfo.feature.deadCount}
    • -
- - )} - {data && [ - , - { - return count > 10000 - ? colors[6] - : count > 1000 - ? colors[5] - : count > 500 - ? colors[4] - : count > 100 - ? colors[3] - : count > 10 - ? colors[2] - : count > 1 - ? colors[1] - : colors[0]; - }, - }} - shape={{ - values: 'circle', - }} - active={{ - option: { - color: '#0c2c84', - mix: 0.6, - }, - }} - size={{ - field: 'confirmedCount', - values: [0, 20], - }} - style={{ - opacity: 0.6, - }} - > - - , - ]} - - - ); -}); -ReactDOM.render(, document.getElementById('map')); diff --git a/packages/site/examples/react/covid/demo/meta.json b/packages/site/examples/react/covid/demo/meta.json deleted file mode 100644 index d709dc6a38..0000000000 --- a/packages/site/examples/react/covid/demo/meta.json +++ /dev/null @@ -1,38 +0,0 @@ -{ - "title": { - "zh": "COVID-19 地图", - "en": "COVID-19 Map" - }, - "demos": [ - { - "filename": "covid_grid.tsx", - "title": "世界地图网格背景", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_23a451/afts/img/A*CSUXTIYXXFwAAAAAAAAAAABkARQnAQ" - }, - { - "filename": "covid_animate.tsx", - "title": "气泡动图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_855bab/afts/img/A*4Er4Qo128bkAAAAAAAAAAABkARQnAQ" - }, - { - "filename": "covid_fill.tsx", - "title": "填充图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_855bab/afts/img/A*9lzaSrHuYx0AAAAAAAAAAABkARQnAQ" - }, - { - "filename": "covid_bubble.tsx", - "title": "气泡图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_855bab/afts/img/A*mAWsSrM52gYAAAAAAAAAAABkARQnAQ" - }, - { - "filename": "covid_column.tsx", - "title": "3D柱图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_855bab/afts/img/A*aLV4S6QJ104AAAAAAAAAAABkARQnAQ" - }, - { - "filename": "covid_extrude.tsx", - "title": "3D 填充图", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_855bab/afts/img/A*cuMmRqXzQu4AAAAAAAAAAABkARQnAQ" - } - ] -} diff --git a/packages/site/examples/react/covid/index.en.md b/packages/site/examples/react/covid/index.en.md deleted file mode 100644 index 55954bbab1..0000000000 --- a/packages/site/examples/react/covid/index.en.md +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: COVID-19 Map -order: 0 ---- -[![github](https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Nk9mQ48ZoZMAAAAAAAAAAABkARQnAQ)](https://github.com/antvis/L7) - diff --git a/packages/site/examples/react/covid/index.zh.md b/packages/site/examples/react/covid/index.zh.md deleted file mode 100644 index a4bb66bfc3..0000000000 --- a/packages/site/examples/react/covid/index.zh.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -title: COVID-19（新冠肺炎）地图 -order: 0 ---- -[![github](https://gw.alipayobjects.com/mdn/rms_f8c6a0/afts/img/A*Nk9mQ48ZoZMAAAAAAAAAAABkARQnAQ)](https://github.com/antvis/L7) diff --git a/packages/site/examples/tile/vector/API.en.md b/packages/site/examples/tile/vector/API.en.md deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/packages/site/examples/tile/vector/API.zh.md b/packages/site/examples/tile/vector/API.zh.md deleted file mode 100644 index e69de29bb2..0000000000 diff --git a/packages/site/examples/tile/vector/demo/line.js b/packages/site/examples/tile/vector/demo/line.js deleted file mode 100644 index 99724f6bdc..0000000000 --- a/packages/site/examples/tile/vector/demo/line.js +++ /dev/null @@ -1,35 +0,0 @@ -import { Scene, LineLayer } from '@antv/l7'; -import { Map } from '@antv/l7-maps'; - -const scene = new Scene({ - id: 'map', - stencil: true, - map: new Map({ - center: [ 100, 30.3628 ], - zoom: 1 - }) -}); - -scene.on('loaded', () => { - const layer = new LineLayer({ - featureId: 'COLOR', - sourceLayer: 'ecoregions2' - }); - layer - .source( - 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/rs_l7/{z}/{x}/{y}.pbf', - { - parser: { - type: 'mvt', - tileSize: 256, - zoomOffset: 0, - maxZoom: 9, - extent: [ -180, -85.051129, 179, 85.051129 ] - } - } - ) - .size(2) - .color('COLOR'); - - scene.addLayer(layer); -}); diff --git a/packages/site/examples/tile/vector/demo/meta.json b/packages/site/examples/tile/vector/demo/meta.json deleted file mode 100644 index 3236e0523c..0000000000 --- a/packages/site/examples/tile/vector/demo/meta.json +++ /dev/null @@ -1,28 +0,0 @@ -{ - "title": { - "zh": "矢量瓦片图层", - "en": "Vector Tile" - }, - "demos": [ - { - "filename": "polygon.js", - "title": "矢量 polygon", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*GgzeQoJdn80AAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "line.js", - "title": "矢量 line", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*qGm9S756ggMAAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "point.js", - "title": "矢量 point", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*GlzySLqOgH8AAAAAAAAAAAAAARQnAQ" - }, - { - "filename": "text.js", - "title": "矢量 text", - "screenshot": "https://gw.alipayobjects.com/mdn/rms_816329/afts/img/A*0TVXSbkyKvsAAAAAAAAAAAAAARQnAQ" - } - ] -} diff --git a/packages/site/examples/tile/vector/demo/point.js b/packages/site/examples/tile/vector/demo/point.js deleted file mode 100644 index cd1872f617..0000000000 --- a/packages/site/examples/tile/vector/demo/point.js +++ /dev/null @@ -1,36 +0,0 @@ -import { Scene, PointLayer } from '@antv/l7'; -import { Map } from '@antv/l7-maps'; - -const scene = new Scene({ - id: 'map', - stencil: true, - map: new Map({ - center: [ 100, 30.3628 ], - zoom: 1 - }) -}); - -scene.on('loaded', () => { - const layer = new PointLayer({ - featureId: 'COLOR', - sourceLayer: 'ecoregions2' - }); - layer - .source( - 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/rs_l7/{z}/{x}/{y}.pbf', - { - parser: { - type: 'mvt', - tileSize: 256, - zoomOffset: 0, - maxZoom: 9, - extent: [ -180, -85.051129, 179, 85.051129 ] - } - } - ) - .size(10) - .color('COLOR') - .active(true); - - scene.addLayer(layer); -}); diff --git a/packages/site/examples/tile/vector/demo/polygon.js b/packages/site/examples/tile/vector/demo/polygon.js deleted file mode 100644 index fe8dec0cfd..0000000000 --- a/packages/site/examples/tile/vector/demo/polygon.js +++ /dev/null @@ -1,35 +0,0 @@ -import { Scene, PolygonLayer } from '@antv/l7'; -import { Map } from '@antv/l7-maps'; - -const scene = new Scene({ - id: 'map', - stencil: true, - map: new Map({ - center: [ 100, 30.3628 ], - zoom: 1 - }) -}); - -scene.on('loaded', () => { - const layer = new PolygonLayer({ - featureId: 'COLOR', - sourceLayer: 'ecoregions2' - }); - layer - .source( - 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/rs_l7/{z}/{x}/{y}.pbf', - { - parser: { - type: 'mvt', - tileSize: 256, - zoomOffset: 0, - maxZoom: 9, - extent: [ -180, -85.051129, 179, 85.051129 ] - } - } - ) - .color('COLOR') - .active(true); - - scene.addLayer(layer); -}); diff --git a/packages/site/examples/tile/vector/demo/text.js b/packages/site/examples/tile/vector/demo/text.js deleted file mode 100644 index c0912eb46b..0000000000 --- a/packages/site/examples/tile/vector/demo/text.js +++ /dev/null @@ -1,41 +0,0 @@ -import { Scene, PointLayer } from '@antv/l7'; -import { Map } from '@antv/l7-maps'; - -const scene = new Scene({ - id: 'map', - stencil: true, - map: new Map({ - center: [ 100, 30.3628 ], - zoom: 1 - }) -}); - -scene.on('loaded', () => { - const layer = new PointLayer({ - featureId: 'COLOR', - sourceLayer: 'ecoregions2' - }); - layer - .source( - 'https://ganos.oss-cn-hangzhou.aliyuncs.com/m2/rs_l7/{z}/{x}/{y}.pbf', - { - parser: { - type: 'mvt', - tileSize: 256, - zoomOffset: 0, - maxZoom: 9 - } - } - ) - .shape('NNH_NAME', 'text') - .size(10) - .color('COLOR') - .active(true) - .style({ - stroke: '#00f', - strokeWidth: 1, - textAllowOverlap: false - }); - - scene.addLayer(layer); -}); diff --git a/packages/site/examples/tile/vector/index.en.md b/packages/site/examples/tile/vector/index.en.md deleted file mode 100644 index 5d27daa1ed..0000000000 --- a/packages/site/examples/tile/vector/index.en.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -title: Vector Tile -order: 1 ---- diff --git a/packages/site/examples/tile/vector/index.zh.md b/packages/site/examples/tile/vector/index.zh.md deleted file mode 100644 index 543ec43f45..0000000000 --- a/packages/site/examples/tile/vector/index.zh.md +++ /dev/null @@ -1,4 +0,0 @@ ---- -title: 矢量瓦片图层 -order: 1 ----