wisemapping-frontend/packages/web2d/lib/components/peer/svg/ArrowPeer.js

99 lines
3.0 KiB
JavaScript
Raw Normal View History

2021-07-16 16:41:58 +02:00
/*
* Copyright [2015] [wisemapping]
*
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
* It is basically the Apache License, Version 2.0 (the "License") plus the
* "powered by wisemapping" text requirement on every single page;
* you may not use this file except in compliance with the License.
* You may obtain a copy of the license at
*
* http://www.wisemapping.org/license
*
* Unless required by applicable law or agreed to in writing, software
* distributed under the License is distributed on an "AS IS" BASIS,
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
* See the License for the specific language governing permissions and
* limitations under the License.
*/
2021-10-05 01:56:40 +02:00
const ElementPeer = require('./ElementPeer').default;
2021-07-16 16:41:58 +02:00
const ArrowPeer = new Class({
2021-10-05 01:56:40 +02:00
Extends: ElementPeer,
initialize() {
const svgElement = window.document.createElementNS(this.svgNamespace, 'path');
this.parent(svgElement);
this._style = {};
this._controlPoint = new core.Point();
this._fromPoint = new core.Point();
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
setFrom(x, y) {
this._fromPoint.x = x;
this._fromPoint.y = y;
this._redraw();
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
setControlPoint(point) {
this._controlPoint = point;
this._redraw();
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
setStrokeColor(color) {
this.setStroke(null, null, color, null);
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
setStrokeWidth(width) {
this.setStroke(width);
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
setDashed(isDashed, length, spacing) {
if ($defined(isDashed) && isDashed && $defined(length) && $defined(spacing)) {
this._native.setAttribute('stroke-dasharray', `${length},${spacing}`);
} else {
this._native.setAttribute('stroke-dasharray', '');
}
},
2021-10-05 01:56:40 +02:00
_updateStyle() {
let style = '';
for (const key in this._style) {
style += `${key}:${this._style[key]} `;
}
this._native.setAttribute('style', style);
},
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
_redraw() {
let x; let y; let xp; let
yp;
if ($defined(this._fromPoint.x) && $defined(this._fromPoint.y) && $defined(this._controlPoint.x) && $defined(this._controlPoint.y)) {
if (this._controlPoint.y == 0) this._controlPoint.y = 1;
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
const y0 = this._controlPoint.y;
const x0 = this._controlPoint.x;
const x2 = x0 + y0;
const y2 = y0 - x0;
const x3 = x0 - y0;
const y3 = y0 + x0;
const m = y2 / x2;
const mp = y3 / x3;
const l = 6;
const { pow } = Math;
x = (x2 == 0 ? 0 : Math.sqrt(pow(l, 2) / (1 + pow(m, 2))));
x *= Math.sign(x2);
y = (x2 == 0 ? l * Math.sign(y2) : m * x);
xp = (x3 == 0 ? 0 : Math.sqrt(pow(l, 2) / (1 + pow(mp, 2))));
xp *= Math.sign(x3);
yp = (x3 == 0 ? l * Math.sign(y3) : mp * xp);
2021-07-16 16:41:58 +02:00
2021-10-05 01:56:40 +02:00
const path = `M${this._fromPoint.x},${this._fromPoint.y} `
+ `L${x + this._fromPoint.x},${y + this._fromPoint.y
}M${this._fromPoint.x},${this._fromPoint.y} `
+ `L${xp + this._fromPoint.x},${yp + this._fromPoint.y}`;
this._native.setAttribute('d', path);
2021-07-16 16:41:58 +02:00
}
2021-10-05 01:56:40 +02:00
},
2021-07-16 16:41:58 +02:00
});
export default ArrowPeer;