window.vue 1.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041
  1. <template>
  2. <div>
  3. <canvas id="wall" width="800" height="400" tabindex="0" />
  4. </div>
  5. </template>
  6. <script>
  7. import {SGraphScene, SGraphView} from "@persagy-web/graph/";
  8. import {SWindowItem} from "@persagy-web/big/lib/items/floor/SWindowItem";
  9. export default {
  10. name: "wall",
  11. data(){
  12. return {
  13. view: null,
  14. // 图中靠上位置的黑色矩形轮廓
  15. outline1:[[{X:120,Y:-30},{X:120,Y:-50},{X:10,Y:-50},{X:10,Y:-30}]],
  16. }
  17. },
  18. mounted() {
  19. this.init();
  20. },
  21. methods:{
  22. init(){
  23. this.view = new SGraphView('wall');
  24. const scene = new SGraphScene();
  25. this.view.scene = scene;
  26. // 只模拟了轮廓数据
  27. const item = new SWindowItem(null,{OutLine:this.outline1});
  28. scene.addItem(item);
  29. this.view.fitSceneToView();
  30. this.view.scalable = false;
  31. }
  32. }
  33. }
  34. </script>
  35. <style scoped>
  36. </style>