haojianlong 4 anni fa
parent
commit
f80768ca88

+ 8 - 6
docs/.vuepress/components/engine/arrow.vue

@@ -46,17 +46,18 @@
             new SPoint(2000, 100),
             new SPoint(1800, 1800),
             new SPoint(1200, 1800),
-            new SPoint(1000, 1000)
+            new SPoint(1000, 1000),
+            new SPoint(0, 0)
         ];
 
         boundingRect() {
-            return new SRect(0,0,2000,2000);
+            return new SRect(0,0,2000,1800);
         }
         onDraw(painter) {
             painter.pen.lineWidth = painter.toPx(1);
             const style = {
-                begin: 3,
-                end: 3
+                begin: this.begin,
+                end: this.end
             };
             for(let i = 0; i < this.pointList.length - 1; i++){
 
@@ -132,12 +133,13 @@
                 scene.addItem(this.item);
                 this.view.scene = scene;
                 this.view.fitSceneToView();
-                // this.view.scalable = false;
+                this.view.scalable = false;
             },
             changeStart(val){
+                this.item.begin = val
             },
             changeEnd(val){
-
+                this.item.end = val
             }
         }
     }

+ 2 - 15
docs/.vuepress/components/scene/items/rect.vue

@@ -8,7 +8,7 @@
 <script>
 
     import {SGraphScene, SGraphShape, SGraphView} from "@persagy-web/graph/lib";
-    import {SRect,SRadialGradient,SLinearGradient} from "@persagy-web/draw/lib";
+    import {SRect} from "@persagy-web/draw/lib";
 
     class rect extends SGraphShape{
         constructor(parent, data) {
@@ -23,7 +23,7 @@
         }
         onDraw(painter) {
             super.onDraw(painter);
-            painter.drawRect(this.leftTopX,this.leftTopyY,this.width,this.height)
+            painter.drawRoundRect(this.leftTopX,this.leftTopyY,this.width,this.height)
         }
     }
     export default {
@@ -111,19 +111,6 @@
                 if (this.item) {
                     this.item.enabled = !this.item.enabled;
                 }
-            },
-            parseGrad(str){
-                if (str.indexOf('SLinearGradient') > -1) {
-                    const index1 = str.indexOf('{');
-                    const index2 = str.indexOf('}');
-                    const temp = str.substring(index1, index2);
-                    const grad = new SLinearGradient();
-                    return
-                } else if (str.indexOf('SRadialGradient') > -1) {
-                    const grad = new SRadialGradient();
-                    return
-                }
-                return str;
             }
         }
     }

+ 1 - 0
docs/.vuepress/templates/dev.html

@@ -8,6 +8,7 @@
 <body>
 <script>
     const Image = window.Image;//定义global
+    const btoa = window.btoa;
 </script>
 <div id="app"></div>
 </body>

+ 1 - 0
docs/.vuepress/templates/ssr.html

@@ -11,6 +11,7 @@
     {{{ renderStyles() }}}
     <script>
         const Image = window.Image;//定义global变量
+        const btoa = window.btoa;
     </script>
 </head>
 <body>

+ 18 - 17
docs/guides/engine/arrow.md

@@ -1,24 +1,25 @@
-# 绘图指令-绘制带有末端样式的线段
+# 绘制带有末端样式的线段
 
 ::: details 目录
 [[toc]]
 :::
 
-## 函数入参
+<engine-arrow /> 
 
-传入线段和末端样式style{begin?:SArrowStyleType,end?:SArrowStyleType}
+## 函数入参
 
+传入线段和末端样式```style{begin?:SArrowStyleType,end?:SArrowStyleType}```
+``` typescript
 drawArrowLine(line: SLine, style?: SArrow):void
-
+```
 传入线段的两个点和末端样式
-
+``` typescript
 drawArrowLine(p1: SPoint, p2: SPoint, style?: SArrow): void;
-
+```
 传入线段的两个点的坐标值和末端样式
-
+``` typescript
 drawArrowLine(x1: number,y1: number,x2: number,y2: number,style?: SArrow): void;
-
-<engine-arrow /> 
+```
 
 ::: details 查看代码
 <<< @/docs/.vuepress/components/engine/arrow.vue
@@ -42,13 +43,13 @@ drawArrowLine(x1: number,y1: number,x2: number,y2: number,style?: SArrow): void;
 
 2.计算出线段与x轴夹角,并将坐标系旋转至x轴与线段重合;
 
-3.设定箭头夹角为θ=π/2,末端三角形边长d=5,则箭头上下端与x轴夹角为π/4,根据此角度与边长计算上下端坐标;
+3.设定箭头夹角为```θ=π/2```,末端三角形边长```d=5```,则箭头上下端与x轴夹角为```π/4```,根据此角度与边长计算上下端坐标;
 
 4.直接绘制原点与上下端连线的折线图形即可;
 
 ![标准箭头计算](./img/basic-jisuan.png)
 
-```
+``` javascript
 // 定义箭头长度
 const d = 5;
 // 箭头横坐标
@@ -77,9 +78,9 @@ this.restore();
 
 #### 画法描述
 
-坐标点位置计算与标准箭头类似,只是箭头夹角θ=π/6,且最后绘制图形为多边形
+坐标点位置计算与标准箭头类似,只是箭头夹角```θ=π/6```,且最后绘制图形为多边形
 
-```
+``` javascript
 // 定义箭头长度
 const d = 5;
 // 箭头横坐标
@@ -110,11 +111,11 @@ this.restore();
 
 1.将坐标系平移至线段终点;
 
-2.设定圆半径r=5,计算圆心坐标为(-r,0),绘制圆形即可
+2.设定圆半径```r=5```,计算圆心坐标为(-r,0),绘制圆形即可
 
 ![圆形计算](./img/circle-jisuan.png)
 
-```
+``` javascript
 // 定义箭头长度
 const d = 5;
 // 线段与x轴夹角
@@ -139,7 +140,7 @@ this.restore();
 
 ![菱形计算](./img/diamond-jisuan.jpg)
 
-```
+``` javascript
 // 定义箭头长度
 const d = 5;
 // 箭头横坐标
@@ -175,7 +176,7 @@ this.restore();
 
 ![方形计算](./img/square-jisuan.png)
 
-```
+``` javascript
 // 定义箭头长度
 const d = 5;
 // 线段与x轴夹角

+ 3 - 3
package.json

@@ -13,9 +13,9 @@
   },
   "dependencies": {
     "@persagy-web/base": "2.2.1",
-    "@persagy-web/big": "2.2.2",
-    "@persagy-web/draw": "2.2.3",
-    "@persagy-web/graph": "2.2.4",
+    "@persagy-web/big": "2.2.3",
+    "@persagy-web/draw": "2.2.4",
+    "@persagy-web/graph": "2.2.5",
     "axios": "^0.19.2",
     "element-ui": "^2.12.0",
     "vue": "^2.6.10",