mirror of
https://github.com/tengge1/ShadowEditor.git
synced 2026-01-25 15:08:11 +00:00
修复svg新架构bug。
This commit is contained in:
parent
3773c4646c
commit
f9eda0f2db
48
ShadowEditor.SVG/dist/ShadowEditor.SVG.js
vendored
48
ShadowEditor.SVG/dist/ShadowEditor.SVG.js
vendored
@ -398,6 +398,8 @@
|
||||
return control;
|
||||
};
|
||||
|
||||
const SVG = new Manager();
|
||||
|
||||
/**
|
||||
* SVG文档
|
||||
* @author tengge / https://github.com/tengge1
|
||||
@ -414,7 +416,7 @@
|
||||
this.renderDom(this.createElement('svg'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('dom', Dom);
|
||||
SVG.addXType('dom', Dom);
|
||||
|
||||
/**
|
||||
* SVG圆
|
||||
@ -432,7 +434,7 @@
|
||||
this.renderDom(this.createElement('circle'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('circle', Circle);
|
||||
SVG.addXType('circle', Circle);
|
||||
|
||||
/**
|
||||
* SVG椭圆
|
||||
@ -450,7 +452,7 @@
|
||||
this.renderDom(this.createElement('ellipse'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('ellipse', Ellipse);
|
||||
SVG.addXType('ellipse', Ellipse);
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -468,7 +470,7 @@
|
||||
this.renderDom(this.createElement('line'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('line', Line);
|
||||
SVG.addXType('line', Line);
|
||||
|
||||
/**
|
||||
* SVG面
|
||||
@ -486,7 +488,7 @@
|
||||
this.renderDom(this.createElement('polygon'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('polygon', Polygon);
|
||||
SVG.addXType('polygon', Polygon);
|
||||
|
||||
/**
|
||||
* SVG曲线
|
||||
@ -504,7 +506,7 @@
|
||||
this.renderDom(this.createElement('polyline'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('polyline', Polyline);
|
||||
SVG.addXType('polyline', Polyline);
|
||||
|
||||
/**
|
||||
* SVG矩形
|
||||
@ -522,7 +524,7 @@
|
||||
this.renderDom(this.createElement('rect'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('rect', Rect);
|
||||
SVG.addXType('rect', Rect);
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -540,7 +542,7 @@
|
||||
this.renderDom(this.createElement('path'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('path', Path);
|
||||
SVG.addXType('path', Path);
|
||||
|
||||
/**
|
||||
* SVG文本
|
||||
@ -549,8 +551,6 @@
|
||||
*/
|
||||
function Text(options = {}) {
|
||||
SvgControl.call(this, options);
|
||||
|
||||
this.text = options.text || null;
|
||||
}
|
||||
|
||||
Text.prototype = Object.create(SvgControl.prototype);
|
||||
@ -560,7 +560,7 @@
|
||||
this.renderDom(this.createElement('text'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('text', Text);
|
||||
SVG.addXType('text', Text);
|
||||
|
||||
/**
|
||||
* SVG文本路径
|
||||
@ -578,7 +578,7 @@
|
||||
this.renderDom(this.createElement('textPath'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('textpath', TextPath);
|
||||
SVG.addXType('textpath', TextPath);
|
||||
|
||||
/**
|
||||
* SVG链接
|
||||
@ -596,7 +596,7 @@
|
||||
this.renderDom(this.createElement('a'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('a', Anchor);
|
||||
SVG.addXType('a', Anchor);
|
||||
|
||||
/**
|
||||
* SVG定义
|
||||
@ -614,7 +614,7 @@
|
||||
this.renderDom(this.createElement('defs'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('defs', Defs);
|
||||
SVG.addXType('defs', Defs);
|
||||
|
||||
/**
|
||||
* SVG Use
|
||||
@ -632,7 +632,7 @@
|
||||
this.renderDom(this.createElement('use'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('use', Use);
|
||||
SVG.addXType('use', Use);
|
||||
|
||||
/**
|
||||
* 线性渐变
|
||||
@ -650,7 +650,7 @@
|
||||
this.renderDom(this.createElement('linearGradient'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('lineargradient', linearGradient);
|
||||
SVG.addXType('lineargradient', linearGradient);
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -668,7 +668,7 @@
|
||||
this.renderDom(this.createElement('g'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('g', Group);
|
||||
SVG.addXType('g', Group);
|
||||
|
||||
/**
|
||||
* SVG滤镜
|
||||
@ -686,7 +686,7 @@
|
||||
this.renderDom(this.createElement('filter'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('filter', Filter);
|
||||
SVG.addXType('filter', Filter);
|
||||
|
||||
/**
|
||||
* SVG高斯滤镜
|
||||
@ -704,7 +704,7 @@
|
||||
this.renderDom(this.createElement('feGaussianBlur'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('fegaussianblur', feGaussianBlur);
|
||||
SVG.addXType('fegaussianblur', feGaussianBlur);
|
||||
|
||||
/**
|
||||
* SVG偏移滤镜
|
||||
@ -722,7 +722,7 @@
|
||||
this.renderDom(this.createElement('feOffset'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('feoffset', feOffset);
|
||||
SVG.addXType('feoffset', feOffset);
|
||||
|
||||
/**
|
||||
* SVG融合滤镜
|
||||
@ -740,7 +740,7 @@
|
||||
this.renderDom(this.createElement('feBlend'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('feblend', feBlend);
|
||||
SVG.addXType('feblend', feBlend);
|
||||
|
||||
/**
|
||||
* SVG融合滤镜
|
||||
@ -758,11 +758,9 @@
|
||||
this.renderDom(this.createElement('feColorMatrix'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('fecolormatrix', feColorMatrix);
|
||||
SVG.addXType('fecolormatrix', feColorMatrix);
|
||||
|
||||
const SVG = new Manager();
|
||||
|
||||
window.SVG = SVG;
|
||||
// dom
|
||||
|
||||
exports.SvgControl = SvgControl;
|
||||
exports.SVG = SVG;
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG链接
|
||||
@ -16,6 +16,6 @@ Anchor.prototype.render = function () {
|
||||
this.renderDom(this.createElement('a'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('a', Anchor);
|
||||
SVG.addXType('a', Anchor);
|
||||
|
||||
export default Anchor;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG文档
|
||||
@ -16,6 +16,6 @@ Dom.prototype.render = function () {
|
||||
this.renderDom(this.createElement('svg'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('dom', Dom);
|
||||
SVG.addXType('dom', Dom);
|
||||
|
||||
export default Dom;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -16,6 +16,6 @@ Group.prototype.render = function () {
|
||||
this.renderDom(this.createElement('g'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('g', Group);
|
||||
SVG.addXType('g', Group);
|
||||
|
||||
export default Group;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -16,6 +16,6 @@ Path.prototype.render = function () {
|
||||
this.renderDom(this.createElement('path'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('path', Path);
|
||||
SVG.addXType('path', Path);
|
||||
|
||||
export default Path;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG文本
|
||||
@ -7,8 +7,6 @@ import { SvgControl } from './third_party';
|
||||
*/
|
||||
function Text(options = {}) {
|
||||
SvgControl.call(this, options);
|
||||
|
||||
this.text = options.text || null;
|
||||
}
|
||||
|
||||
Text.prototype = Object.create(SvgControl.prototype);
|
||||
@ -18,6 +16,6 @@ Text.prototype.render = function () {
|
||||
this.renderDom(this.createElement('text'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('text', Text);
|
||||
SVG.addXType('text', Text);
|
||||
|
||||
export default Text;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from './third_party';
|
||||
import { SvgControl, SVG } from './third_party';
|
||||
|
||||
/**
|
||||
* SVG文本路径
|
||||
@ -16,6 +16,6 @@ TextPath.prototype.render = function () {
|
||||
this.renderDom(this.createElement('textPath'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('textpath', TextPath);
|
||||
SVG.addXType('textpath', TextPath);
|
||||
|
||||
export default TextPath;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG定义
|
||||
@ -16,6 +16,6 @@ Defs.prototype.render = function () {
|
||||
this.renderDom(this.createElement('defs'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('defs', Defs);
|
||||
SVG.addXType('defs', Defs);
|
||||
|
||||
export default Defs;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG Use
|
||||
@ -16,6 +16,6 @@ Use.prototype.render = function () {
|
||||
this.renderDom(this.createElement('use'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('use', Use);
|
||||
SVG.addXType('use', Use);
|
||||
|
||||
export default Use;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* 线性渐变
|
||||
@ -16,6 +16,6 @@ linearGradient.prototype.render = function () {
|
||||
this.renderDom(this.createElement('linearGradient'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('lineargradient', linearGradient);
|
||||
SVG.addXType('lineargradient', linearGradient);
|
||||
|
||||
export default linearGradient;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG滤镜
|
||||
@ -16,6 +16,6 @@ Filter.prototype.render = function () {
|
||||
this.renderDom(this.createElement('filter'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('filter', Filter);
|
||||
SVG.addXType('filter', Filter);
|
||||
|
||||
export default Filter;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG融合滤镜
|
||||
@ -16,6 +16,6 @@ feBlend.prototype.render = function () {
|
||||
this.renderDom(this.createElement('feBlend'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('feblend', feBlend);
|
||||
SVG.addXType('feblend', feBlend);
|
||||
|
||||
export default feBlend;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG融合滤镜
|
||||
@ -16,6 +16,6 @@ feColorMatrix.prototype.render = function () {
|
||||
this.renderDom(this.createElement('feColorMatrix'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('fecolormatrix', feColorMatrix);
|
||||
SVG.addXType('fecolormatrix', feColorMatrix);
|
||||
|
||||
export default feColorMatrix;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG高斯滤镜
|
||||
@ -16,6 +16,6 @@ feGaussianBlur.prototype.render = function () {
|
||||
this.renderDom(this.createElement('feGaussianBlur'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('fegaussianblur', feGaussianBlur);
|
||||
SVG.addXType('fegaussianblur', feGaussianBlur);
|
||||
|
||||
export default feGaussianBlur;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG偏移滤镜
|
||||
@ -16,6 +16,6 @@ feOffset.prototype.render = function () {
|
||||
this.renderDom(this.createElement('feOffset'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('feoffset', feOffset);
|
||||
SVG.addXType('feoffset', feOffset);
|
||||
|
||||
export default feOffset;
|
||||
@ -1,9 +1,3 @@
|
||||
import { SvgControl, Manager } from './third_party';
|
||||
|
||||
const SVG = new Manager();
|
||||
|
||||
window.SVG = SVG;
|
||||
|
||||
// dom
|
||||
import './Dom';
|
||||
|
||||
@ -31,4 +25,4 @@ import './filter/feOffset';
|
||||
import './filter/feBlend';
|
||||
import './filter/feColorMatrix';
|
||||
|
||||
export { SvgControl, SVG };
|
||||
export { SvgControl, SVG } from './third_party';;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG圆
|
||||
@ -16,6 +16,6 @@ Circle.prototype.render = function () {
|
||||
this.renderDom(this.createElement('circle'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('circle', Circle);
|
||||
SVG.addXType('circle', Circle);
|
||||
|
||||
export default Circle;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG椭圆
|
||||
@ -16,6 +16,6 @@ Ellipse.prototype.render = function () {
|
||||
this.renderDom(this.createElement('ellipse'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('ellipse', Ellipse);
|
||||
SVG.addXType('ellipse', Ellipse);
|
||||
|
||||
export default Ellipse;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG线
|
||||
@ -16,6 +16,6 @@ Line.prototype.render = function () {
|
||||
this.renderDom(this.createElement('line'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('line', Line);
|
||||
SVG.addXType('line', Line);
|
||||
|
||||
export default Line;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG面
|
||||
@ -16,6 +16,6 @@ Polygon.prototype.render = function () {
|
||||
this.renderDom(this.createElement('polygon'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('polygon', Polygon);
|
||||
SVG.addXType('polygon', Polygon);
|
||||
|
||||
export default Polygon;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG曲线
|
||||
@ -16,6 +16,6 @@ Polyline.prototype.render = function () {
|
||||
this.renderDom(this.createElement('polyline'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('polyline', Polyline);
|
||||
SVG.addXType('polyline', Polyline);
|
||||
|
||||
export default Polyline;
|
||||
@ -1,4 +1,4 @@
|
||||
import { SvgControl } from '../third_party';
|
||||
import { SvgControl, SVG } from '../third_party';
|
||||
|
||||
/**
|
||||
* SVG矩形
|
||||
@ -16,6 +16,6 @@ Rect.prototype.render = function () {
|
||||
this.renderDom(this.createElement('rect'));
|
||||
};
|
||||
|
||||
window.SVG.addXType('rect', Rect);
|
||||
SVG.addXType('rect', Rect);
|
||||
|
||||
export default Rect;
|
||||
@ -1 +1,5 @@
|
||||
export { SvgControl, Manager } from '@tengge1/xtype.js';
|
||||
import { SvgControl, Manager } from '@tengge1/xtype.js';
|
||||
|
||||
const SVG = new Manager();
|
||||
|
||||
export { SvgControl, SVG };
|
||||
@ -12,20 +12,18 @@
|
||||
<script src="../dist/ShadowEditor.SVG.js"></script>
|
||||
<script>
|
||||
function CustomControl(options = {}) {
|
||||
Shadow.Control.call(this, options);
|
||||
Shadow.SvgControl.call(this, options);
|
||||
}
|
||||
|
||||
CustomControl.prototype = Object.create(Shadow.Control.prototype);
|
||||
CustomControl.prototype = Object.create(Shadow.SvgControl.prototype);
|
||||
CustomControl.prototype.constructor = CustomControl;
|
||||
|
||||
CustomControl.prototype.render = function () {
|
||||
var dom = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
|
||||
this.renderDom(dom);
|
||||
this.renderDom(this.createElement('circle'));
|
||||
};
|
||||
|
||||
var dom = UI.create({
|
||||
xtype: 'svgdom',
|
||||
id: 'dom1',
|
||||
var dom = Shadow.SVG.create({
|
||||
xtype: 'dom',
|
||||
parent: document.body,
|
||||
attr: {
|
||||
width: 800,
|
||||
43
ShadowEditor.SVG/test/02 SvgCircleTest.html
Normal file
43
ShadowEditor.SVG/test/02 SvgCircleTest.html
Normal file
@ -0,0 +1,43 @@
|
||||
<!DOCTYPE html>
|
||||
|
||||
<html lang="zh-cn">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>02 SvgCircleTest</title>
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<script src="../dist/ShadowEditor.SVG.js"></script>
|
||||
<script>
|
||||
var dom = Shadow.SVG.create({
|
||||
xtype: 'dom',
|
||||
parent: document.body,
|
||||
attr: {
|
||||
width: 800,
|
||||
height: 600,
|
||||
},
|
||||
children: [{
|
||||
xtype: 'circle',
|
||||
attr: {
|
||||
cx: 80,
|
||||
cy: 80,
|
||||
r: 50,
|
||||
stroke: '#555',
|
||||
'stroke-width': 2,
|
||||
fill: '#f00'
|
||||
},
|
||||
listeners: {
|
||||
click: () => {
|
||||
alert('You clicked!');
|
||||
}
|
||||
}
|
||||
}]
|
||||
});
|
||||
|
||||
dom.render();
|
||||
</script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
x
Reference in New Issue
Block a user