1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768 |
- <template>
- <div id="graphContainer" ref="graphContainer">
- <canvas id="spaceCanvas" :width="canvasWidth" :height="canvasHeight" tabindex="0"></canvas>
- </div>
- </template>
- <script lang="ts">
- import { Vue, Component } from "vue-property-decorator";
- import { FloorView } from "@/utils/graph/FloorView";
- import { FloorScene } from "@/utils/graph/FloorScene";
- @Component
- export default class spaceGraph extends Vue {
- canvasWidth = 800;
- canvasHeight = 800;
- view: FloorView | undefined = undefined;
- floorMap =
- "/image-service/common/file_get?systemId=revit&key=base/76233a3214dd11eb94d469663ce1649a.jsonz";
- canvasLoading = false;
- mounted(): void {
- this.canvasWidth = this.$refs.graphContainer.offsetWidth;
- this.canvasHeight = this.$refs.graphContainer.offsetHeight;
- this.getGraph();
- }
- init(): void {
- console.log('init');
- }
- getGraph(): void {
- const scene = new FloorScene();
- this.canvasLoading = true;
- this.clearGraphy()
- scene.loadUrl(this.floorMap).then((res) => {
- if (this.view) {
- this.view.scene = scene;
- }
- this.getGraphSuc(res);
- });
- }
- getGraphSuc(res: any): void {
- this.canvasLoading = false;
- if (res == "error") {
- this.floorMap = "";
- this.$message.warning("数据解析异常");
- return;
- }
- this.view?.fitSceneToView()
- }
- // 清除canvas
- clearGraphy() {
- if (this.view) {
- this.view.scene = null;
- return
- }
- this.view = new FloorView('spaceCanvas')
- }
- }
- </script>
- <style lang="scss">
- #graphContainer {
- position: relative;
- width: 100%;
- height: 100%;
- }
- </style>
|