enyo 框架集成 which raphael
enyo framework to integrate which raphael
我正在尝试将 Raphael 与 enyo.js 集成,以使用 Raphael 而不是通过 enyo 创建 SVG 组件,这样我就可以使用 Raphael 的一些功能。我想用我在 jsfiddle 下创建的子组件 svg
替换默认呈现的 div
。谁能帮我解决一下?
http://jsfiddle.net/stackit/uzjafamo/8/
代码
enyo.kind({
name: "Board",
kind: "enyo.Control",
paper: null,
create: function(){
this.inherited(arguments);
},
rendered: function(){
this.inherited(arguments);
if(this.hasNode()){
paper = Raphael(this.hasNode().id, 100, 100);
}
}
})
enyo.kind({
name: "pages",
kind: "enyo.Control",
create: function(){
this.inherited(arguments);
this.loadView();
},
loadView: function(){
if(!this.$.board){
var com = this.createComponent({
name: "board",
kind: "Board",
},{
owner: this
});
com.render();
}
}
});
new pages().renderInto(document.getElementById("cans"));
我查看了您的 fiddle 并发现了一些可以改进的地方。 jsFiddle 容器最初给我带来了一些麻烦,直到我出于某种原因将其分叉。
这是我想出的:http://jsfiddle.net/Djspaceg/5qyLej05/4/
enyo.kind({
name: "Board",
kind: "enyo.Control",
paper: null,
create: function () {
this.inherited(arguments);
},
rendered: function () {
this.inherited(arguments);
if (this.hasNode() && !this.paper) {
this.generateRaphael();
}
},
generateRaphael: function () {
this.paper = Raphael(this.hasNode().id, 100, 100);
}
});
enyo.kind({
name: "pages",
kind: "enyo.Control",
create: function () {
this.inherited(arguments);
this.loadView();
},
loadView: function () {
if (!this.$.board) {
var com = this.createComponent({
name: "board",
kind: "Board",
});
com.render();
}
}
});
new pages().renderInto(document.getElementById("cans"));
它只会生成一个空的拉斐尔canvas。
干杯!
我正在尝试将 Raphael 与 enyo.js 集成,以使用 Raphael 而不是通过 enyo 创建 SVG 组件,这样我就可以使用 Raphael 的一些功能。我想用我在 jsfiddle 下创建的子组件 svg
替换默认呈现的 div
。谁能帮我解决一下?
http://jsfiddle.net/stackit/uzjafamo/8/
代码
enyo.kind({
name: "Board",
kind: "enyo.Control",
paper: null,
create: function(){
this.inherited(arguments);
},
rendered: function(){
this.inherited(arguments);
if(this.hasNode()){
paper = Raphael(this.hasNode().id, 100, 100);
}
}
})
enyo.kind({
name: "pages",
kind: "enyo.Control",
create: function(){
this.inherited(arguments);
this.loadView();
},
loadView: function(){
if(!this.$.board){
var com = this.createComponent({
name: "board",
kind: "Board",
},{
owner: this
});
com.render();
}
}
});
new pages().renderInto(document.getElementById("cans"));
我查看了您的 fiddle 并发现了一些可以改进的地方。 jsFiddle 容器最初给我带来了一些麻烦,直到我出于某种原因将其分叉。
这是我想出的:http://jsfiddle.net/Djspaceg/5qyLej05/4/
enyo.kind({
name: "Board",
kind: "enyo.Control",
paper: null,
create: function () {
this.inherited(arguments);
},
rendered: function () {
this.inherited(arguments);
if (this.hasNode() && !this.paper) {
this.generateRaphael();
}
},
generateRaphael: function () {
this.paper = Raphael(this.hasNode().id, 100, 100);
}
});
enyo.kind({
name: "pages",
kind: "enyo.Control",
create: function () {
this.inherited(arguments);
this.loadView();
},
loadView: function () {
if (!this.$.board) {
var com = this.createComponent({
name: "board",
kind: "Board",
});
com.render();
}
}
});
new pages().renderInto(document.getElementById("cans"));
它只会生成一个空的拉斐尔canvas。
干杯!