Browse Source

整体样式修改;折线item示例添加

haojianlong 4 years ago
parent
commit
c7284663a0

+ 55 - 0
docs/.vuepress/components/example/web/graph/scene/PolylineItem.vue

@@ -0,0 +1,55 @@
+<template>
+    <div>
+        <el-button size="mini" @click="init">清空画布,并初始化折线item</el-button>
+        <el-button size="mini" @click="undo">undo</el-button>
+        <el-button size="mini" @click="redo">redo</el-button>
+        <canvas id="editPolyline" width="740" height="400" tabindex="0"></canvas>
+    </div>
+</template>
+
+<script>
+    import {SGraphScene, SGraphView} from "@saga-web/graph/lib";
+    import {SPolylineItem} from "@saga-web/big/lib";
+    export default {
+        name: "editPolyline",
+        data() {
+            return {
+                scene: null,
+                view: null,
+                item: null,
+            };
+        },
+        mounted() {
+            this.view = new SGraphView("editPolyline");
+            this.scene = new SGraphScene();
+            this.view.scene = this.scene;
+            this.init()
+        },
+        methods:{
+            init(){
+                this.scene.root.children = [];
+                this.item = new SPolylineItem(null,[]);
+                this.scene.addItem(this.item);
+                this.scene.grabItem = this.item;
+                this.view.update();
+            },
+            undo(){
+                if(this.scene.grabItem) {
+                    this.scene.grabItem.undo()
+                }
+            },
+            redo(){
+                if(this.scene.grabItem) {
+                    this.scene.grabItem.redo()
+                }
+            }
+        }
+    }
+</script>
+
+<style scoped>
+canvas{
+    border: 1px solid #eeeeee;
+    outline: none;
+}
+</style>

+ 3 - 0
docs/.vuepress/styles/palette.styl

@@ -0,0 +1,3 @@
+body{
+  user-select :none;
+}

+ 1 - 1
docs/dev/data-center/relations/belongs/Sp2Sp2.md

@@ -310,4 +310,4 @@ select public.rel_sp2sp_v2('Pj1101050001')
 ## 入参
     1. 项目id
 ## 例子
-    select public.rel_sp2sp_v2('Pj1102290002');
+    select public.rel_sp2sp_v2('Pj1102290002');

+ 1 - 0
docs/dev/saga-graphy/index.js

@@ -26,6 +26,7 @@ const content = [
                     ["/dev/saga-graphy/scene-manage/items/text", "文本"],
                     ["/dev/saga-graphy/scene-manage/items/image", "图片"],
                     ["/dev/saga-graphy/scene-manage/items/editLine", "可编辑直线"],
+                    ["/dev/saga-graphy/scene-manage/items/editPolyline", "可编辑折线"],
                     ["/dev/saga-graphy/scene-manage/items/edit-polygon", "可编辑多边形示例"],
                     ["/dev/saga-graphy/scene-manage/items/imgText", "图例item(图片文本组合)"]
                 ]

+ 10 - 0
docs/dev/saga-graphy/scene-manage/items/editPolyline.md

@@ -0,0 +1,10 @@
+# 可编辑折线示例
+
+<example-web-graph-scene-PolylineItem/>
+
+::: tip 注
+1、enter完成创建 <br/>
+2、双击折线附近,进入编辑态;再次双击进入查看态 <br/>
+3、编辑态时:点击点附近更改点位置 <br/>
+4、编辑状态时:通过ALT键 + 鼠标左键 删除顶点
+:::

+ 4 - 4
package.json

@@ -12,10 +12,10 @@
     "publish": "node publish.js"
   },
   "dependencies": {
-    "@saga-web/base": "^2.1.9",
-    "@saga-web/big": "^1.0.24",
-    "@saga-web/draw": "^2.1.84",
-    "@saga-web/graph": "^2.1.68",
+    "@saga-web/base": "^2.1.15",
+    "@saga-web/big": "^1.0.28",
+    "@saga-web/draw": "^2.1.85",
+    "@saga-web/graph": "^2.1.71",
     "@saga-web/feng-map": "1.0.6",
     "axios": "^0.18.1",
     "element-ui": "^2.12.0",