antv-l7/dev-demos/draw/demo/draw.tsx

40 lines
884 B
TypeScript

import { Scene } from '@antv/l7';
import { DrawPolygon } from '@antv/l7-draw';
import { GaodeMap } from '@antv/l7-maps';
import React, { useEffect, useState } from 'react';
const id = String(Math.random());
const Demo: React.FC = () => {
const [, setPolygonDrawer] = useState<DrawPolygon | null>(null);
useEffect(() => {
const scene = new Scene({
id,
map: new GaodeMap({
center: [120.151634, 30.244831],
pitch: 0,
style: 'dark',
zoom: 10,
}),
});
scene.on('loaded', () => {
const drawer = new DrawPolygon(scene, {
areaOptions: {},
// liveUpdate: true,
});
setPolygonDrawer(drawer);
console.log(drawer);
drawer.enable();
});
}, []);
return (
<div>
<div id={id} style={{ height: 400, position: 'relative' }} />
</div>
);
};
export default Demo;