Skip to content

Commit

Permalink
Chore citybuilding update engine (#2149)
Browse files Browse the repository at this point in the history
* fix: fillImage中uniform没对齐的bug

* chore: update citybuilding to Device Engine

---------

Co-authored-by: huyang <[email protected]>
  • Loading branch information
taiyuanhy and huyang authored Dec 11, 2023
1 parent 865c4e0 commit 26af005
Show file tree
Hide file tree
Showing 6 changed files with 269 additions and 239 deletions.
127 changes: 64 additions & 63 deletions dev-demos/features/citybuilding/amap1.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// @ts-ignore
import { CityBuildingLayer, LineLayer, PolygonLayer, Scene } from '@antv/l7';
import { Scene,CityBuildingLayer } from '@antv/l7';
// @ts-ignore
import { GaodeMap } from '@antv/l7-maps';
import React, { useEffect } from 'react';
Expand All @@ -8,6 +8,7 @@ export default () => {
useEffect(() => {
const scene = new Scene({
id: 'map',
renderer:'device',
map: new GaodeMap({
style: 'dark',
center: [120.145, 30.238915],
Expand Down Expand Up @@ -46,71 +47,71 @@ export default () => {
scene.addLayer(pointLayer);
});

fetch(
'https://gw.alipayobjects.com/os/bmw-prod/67130c6c-7f49-4680-915c-54e69730861d.json',
)
.then((data) => data.json())
.then(({ lakeBorderData, lakeData, landData }) => {
const lakeLayer = new PolygonLayer()
.source(lakeData)
.shape('fill')
.color('#1E90FF')
.style({
opacity: 0.4,
opacityLinear: {
enable: true,
dir: 'out', // in - out
},
});
const landLayer = new PolygonLayer()
.source(landData)
.shape('fill')
.color('#3CB371')
.style({
opacity: 0.4,
opacityLinear: {
enable: true,
dir: 'in', // in - out
},
});
// fetch(
// 'https://gw.alipayobjects.com/os/bmw-prod/67130c6c-7f49-4680-915c-54e69730861d.json',
// )
// .then((data) => data.json())
// .then(({ lakeBorderData, lakeData, landData }) => {
// const lakeLayer = new PolygonLayer()
// .source(lakeData)
// .shape('fill')
// .color('#1E90FF')
// .style({
// opacity: 0.4,
// opacityLinear: {
// enable: true,
// dir: 'out', // in - out
// },
// });
// const landLayer = new PolygonLayer()
// .source(landData)
// .shape('fill')
// .color('#3CB371')
// .style({
// opacity: 0.4,
// opacityLinear: {
// enable: true,
// dir: 'in', // in - out
// },
// });

const lakeBorderLayer = new PolygonLayer()
.source(lakeBorderData)
.shape('fill')
.color('#ccc')
.style({
opacity: 0.5,
opacityLinear: {
enable: true,
dir: 'in', // in - out
},
});
// const lakeBorderLayer = new PolygonLayer()
// .source(lakeBorderData)
// .shape('fill')
// .color('#ccc')
// .style({
// opacity: 0.5,
// opacityLinear: {
// enable: true,
// dir: 'in', // in - out
// },
// });

scene.addLayer(lakeLayer);
scene.addLayer(lakeBorderLayer);
scene.addLayer(landLayer);
});
// scene.addLayer(lakeLayer);
// scene.addLayer(lakeBorderLayer);
// scene.addLayer(landLayer);
// });

fetch(
'https://gw.alipayobjects.com/os/basement_prod/40ef2173-df66-4154-a8c0-785e93a5f18e.json',
)
.then((res) => res.json())
.then((data) => {
const layer = new LineLayer({
zIndex: 0,
depth: true,
})
.source(data)
.size(1)
.shape('line')
.color('#1990FF')
.animate({
interval: 1, // 间隔
duration: 2, // 持续时间,延时
trailLength: 2, // 流线长度
});
scene.addLayer(layer);
});
// fetch(
// 'https://gw.alipayobjects.com/os/basement_prod/40ef2173-df66-4154-a8c0-785e93a5f18e.json',
// )
// .then((res) => res.json())
// .then((data) => {
// const layer = new LineLayer({
// zIndex: 0,
// depth: true,
// })
// .source(data)
// .size(1)
// .shape('line')
// .color('#1990FF')
// .animate({
// interval: 1, // 间隔
// duration: 2, // 持续时间,延时
// trailLength: 2, // 流线长度
// });
// scene.addLayer(layer);
// });
}, []);
return (
<div
Expand Down
127 changes: 64 additions & 63 deletions dev-demos/features/citybuilding/amap2.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
// @ts-ignore
import { CityBuildingLayer, LineLayer, PolygonLayer, Scene } from '@antv/l7';
import { CityBuildingLayer, Scene } from '@antv/l7';
// @ts-ignore
import { GaodeMap } from '@antv/l7-maps';
import React, { useEffect } from 'react';
Expand All @@ -8,6 +8,7 @@ export default () => {
useEffect(() => {
const scene = new Scene({
id: 'map',
renderer:'device',
map: new GaodeMap({
style: 'dark',
center: [120.145, 30.238915],
Expand Down Expand Up @@ -46,71 +47,71 @@ export default () => {
scene.addLayer(pointLayer);
});

fetch(
'https://gw.alipayobjects.com/os/bmw-prod/67130c6c-7f49-4680-915c-54e69730861d.json',
)
.then((data) => data.json())
.then(({ lakeBorderData, lakeData, landData }) => {
const lakeLayer = new PolygonLayer()
.source(lakeData)
.shape('fill')
.color('#1E90FF')
.style({
opacity: 0.4,
opacityLinear: {
enable: true,
dir: 'out', // in - out
},
});
const landLayer = new PolygonLayer()
.source(landData)
.shape('fill')
.color('#3CB371')
.style({
opacity: 0.4,
opacityLinear: {
enable: true,
dir: 'in', // in - out
},
});
// fetch(
// 'https://gw.alipayobjects.com/os/bmw-prod/67130c6c-7f49-4680-915c-54e69730861d.json',
// )
// .then((data) => data.json())
// .then(({ lakeBorderData, lakeData, landData }) => {
// const lakeLayer = new PolygonLayer()
// .source(lakeData)
// .shape('fill')
// .color('#1E90FF')
// .style({
// opacity: 0.4,
// opacityLinear: {
// enable: true,
// dir: 'out', // in - out
// },
// });
// const landLayer = new PolygonLayer()
// .source(landData)
// .shape('fill')
// .color('#3CB371')
// .style({
// opacity: 0.4,
// opacityLinear: {
// enable: true,
// dir: 'in', // in - out
// },
// });

const lakeBorderLayer = new PolygonLayer()
.source(lakeBorderData)
.shape('fill')
.color('#ccc')
.style({
opacity: 0.5,
opacityLinear: {
enable: true,
dir: 'in', // in - out
},
});
// const lakeBorderLayer = new PolygonLayer()
// .source(lakeBorderData)
// .shape('fill')
// .color('#ccc')
// .style({
// opacity: 0.5,
// opacityLinear: {
// enable: true,
// dir: 'in', // in - out
// },
// });

scene.addLayer(lakeLayer);
scene.addLayer(lakeBorderLayer);
scene.addLayer(landLayer);
});
// scene.addLayer(lakeLayer);
// scene.addLayer(lakeBorderLayer);
// scene.addLayer(landLayer);
// });

fetch(
'https://gw.alipayobjects.com/os/basement_prod/40ef2173-df66-4154-a8c0-785e93a5f18e.json',
)
.then((res) => res.json())
.then((data) => {
const layer = new LineLayer({
zIndex: 0,
depth: true,
})
.source(data)
.size(1)
.shape('line')
.color('#1990FF')
.animate({
interval: 1, // 间隔
duration: 2, // 持续时间,延时
trailLength: 2, // 流线长度
});
scene.addLayer(layer);
});
// fetch(
// 'https://gw.alipayobjects.com/os/basement_prod/40ef2173-df66-4154-a8c0-785e93a5f18e.json',
// )
// .then((res) => res.json())
// .then((data) => {
// const layer = new LineLayer({
// zIndex: 0,
// depth: true,
// })
// .source(data)
// .size(1)
// .shape('line')
// .color('#1990FF')
// .animate({
// interval: 1, // 间隔
// duration: 2, // 持续时间,延时
// trailLength: 2, // 流线长度
// });
// scene.addLayer(layer);
// });
}, []);
return (
<div
Expand Down
Loading

0 comments on commit 26af005

Please sign in to comment.