archive-gh-me/ShadowEditor
1
0
Fork 0
mirror of https://github.com/tengge1/ShadowEditor.git synced 2026-01-25 15:08:11 +00:00
Code Issues Projects Releases Wiki Activity

滤镜和高斯滤镜。

Browse Source
This commit is contained in:
liteng 2018-11-04 21:17:09 +08:00
parent b048b2eb28
commit 53983b6520
5 changed files with 141 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

38
ShadowEditor.SVG/dist/ShadowEditor.SVG.js vendored
View File

@ -626,6 +626,44 @@
UI.addXType('svguse', SvgUse);
/**
* SVG滤镜
* @author tengge / https://github.com/tengge1
* @param {*} options
*/
function SvgFilter(options = {}) {
Control.call(this, options);
}
SvgFilter.prototype = Object.create(Control.prototype);
SvgFilter.prototype.constructor = SvgFilter;
SvgFilter.prototype.render = function () {
var dom = document.createElementNS('http://www.w3.org/2000/svg', 'filter');
this.renderDom(dom);
};
UI.addXType('svgfilter', SvgFilter);
/**
* SVG高斯滤镜
* @author tengge / https://github.com/tengge1
* @param {*} options
*/
function feGaussianBlur(options = {}) {
Control.call(this, options);
}
feGaussianBlur.prototype = Object.create(Control.prototype);
feGaussianBlur.prototype.constructor = feGaussianBlur;
feGaussianBlur.prototype.render = function () {
var dom = document.createElementNS('http://www.w3.org/2000/svg', 'feGaussianBlur');
this.renderDom(dom);
};
UI.addXType('svgfegaussianblur', feGaussianBlur);
exports.Control = Control;
exports.UI = UI;

22
ShadowEditor.SVG/src/filter/SvgFilter.js Normal file
View File

@ -0,0 +1,22 @@
import { Control, UI } from '../third_party';
/**
* SVG滤镜
* @author tengge / https://github.com/tengge1
* @param {*} options
*/
function SvgFilter(options = {}) {
Control.call(this, options);
}
SvgFilter.prototype = Object.create(Control.prototype);
SvgFilter.prototype.constructor = SvgFilter;
SvgFilter.prototype.render = function () {
var dom = document.createElementNS('http://www.w3.org/2000/svg', 'filter');
this.renderDom(dom);
};
UI.addXType('svgfilter', SvgFilter);
export default SvgFilter;

22
ShadowEditor.SVG/src/filter/feGaussianBlur.js Normal file
View File

@ -0,0 +1,22 @@
import { Control, UI } from '../third_party';
/**
* SVG高斯滤镜
* @author tengge / https://github.com/tengge1
* @param {*} options
*/
function feGaussianBlur(options = {}) {
Control.call(this, options);
}
feGaussianBlur.prototype = Object.create(Control.prototype);
feGaussianBlur.prototype.constructor = feGaussianBlur;
feGaussianBlur.prototype.render = function () {
var dom = document.createElementNS('http://www.w3.org/2000/svg', 'feGaussianBlur');
this.renderDom(dom);
};
UI.addXType('svgfegaussianblur', feGaussianBlur);
export default feGaussianBlur;

3
ShadowEditor.SVG/src/index.js
View File

@ -13,4 +13,7 @@ import './SvgAnchor';
import './defs/SvgDefs';
import './defs/SvgUse';
import './filter/SvgFilter';
import './filter/feGaussianBlur';
export { Control, UI } from './third_party';

56
ShadowEditor.SVG/test/12 SvgGaussianBlurTest.html Normal file
View File

@ -0,0 +1,56 @@
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<title>12 SvgGaussianBlurTest</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 = UI.create({
xtype: 'svgdom',
id: 'dom1',
parent: document.body,
attr: {
width: 800,
height: 600,
},
children: [{
xtype: 'svgdefs',
children: [{
xtype: 'svgfilter',
attr: {
id: 'filter1'
},
children: [{
xtype: 'svgfegaussianblur',
attr: {
in: 'SourceGraphic',
stdDeviation: 20
}
}]
}]
}, {
xtype: 'svgrect',
attr: {
x: 10,
y: 10,
width: 100,
height: 80,
fill: '#f00',
stroke: '#0f0',
'stroke-width': 2,
filter: 'url(#filter1)'
}
}]
});
dom.render();
</script>
</body>
</html>