diff --git a/src/editor/Plot/index.less b/src/editor/Plot/index.less new file mode 100644 index 0000000..807feb6 --- /dev/null +++ b/src/editor/Plot/index.less @@ -0,0 +1,14 @@ +.map-stage{ + position: absolute; + width: 100%; + height: calc(100% - 40px); + top: 40px; + left: 0; +} +.tools-properties{ + position: absolute; + width: 100%; + height: 40px; + background-color: #fff; + border-bottom: 1px solid #ccc; +} \ No newline at end of file diff --git a/src/editor/Plot/index.tsx b/src/editor/Plot/index.tsx index 77b4801..7342801 100644 --- a/src/editor/Plot/index.tsx +++ b/src/editor/Plot/index.tsx @@ -1,7 +1,28 @@ +import { Layout } from "antd"; +import { useEffect, useRef } from "react"; +import { MapStage } from "../../mapStage"; +import "./index.less"; + +const { Header, Footer, Sider, Content } = Layout; + const Plot = () => { - return

属性区域

; -} + + const mapStageRef = useRef(null); + + useEffect(() => { + const map = new MapStage(mapStageRef.current!); + map.init(); + }); + + return ( + <> +
+
+
+ + ); +}; export default Plot; \ No newline at end of file diff --git a/src/editor/Property/index.less b/src/editor/Property/index.less new file mode 100644 index 0000000..e69de29 diff --git a/src/editor/index.less b/src/editor/index.less index 2d7af32..ebcee4e 100644 --- a/src/editor/index.less +++ b/src/editor/index.less @@ -2,6 +2,15 @@ .editor-main{ height: 100%; } +.editor-header{ + height: 40px; + line-height: 40px; + padding: 0 10px; + border-bottom: 1px solid #ccc; +} +.editor-body-center{ + position: relative; +} .editor-header, .editor-body-left, .editor-body-right{ background-color: #fff; } diff --git a/src/editor/index.tsx b/src/editor/index.tsx index 7df82c4..887b4ec 100644 --- a/src/editor/index.tsx +++ b/src/editor/index.tsx @@ -1,8 +1,8 @@ import { useEffect, useRef } from "react"; import { Layout } from "antd"; -import { MapStage } from "../mapStage"; import "./index.less"; +import Plot from "./Plot"; const { Header, Footer, Sider, Content } = Layout; @@ -12,7 +12,9 @@ export const Editor = () => {
header
Sider - Content + + + Sider