0

ここでは、Google クロージャーを使用して、単一の円を含む単純な描画領域ウィジェットを作成しようとしました。

sketcher.load()HTMLスクリプトタグ内で呼び出してロードすると、エラーが発生します:

Uncaught TypeError: Cannot set property 'Widget' of undefined- ここにないものは何ですか?

goog.provide('sketcher');

goog.require('goog.dom');
goog.require('goog.graphics');
goog.require('goog.ui.Component');

var sketcher = {};

sketcher.prototype.Widget = function(el){
    goog.ui.Component.call(this);
    this.parent_ = goog.dom.getElement(el);

    this.g_ = new goog.graphics.createGraphics(600, 400);
    this.appendChild(this.g_);$

    var fill = new goog.graphics.SolidFill('yellow');
    var stroke = new goog.graphics.Stroke(1,'black');
    circle = this.g_.drawCircle(300, 200, 50, stroke, fill);
    this.g_.render(this._parent);
};
goog.inherits(sketcher.Widget, goog.ui.Component);

sketcher.prototype.load = function(){
    var canvas = goog.dom.createDom('div', {'id':'canvas'});
    goog.dom.appendChild(document.body, canvas);
    var widget = new sketcher.Widget(canvas);
};
4

2 に答える 2

2

最初の問題:あなたがgoog.provideするので、スケッチャーは名前空間です。再度宣言する必要はありません。

2番目の問題:sketcher.Widgetは、sketcher.prototype.Widgetではなく、このようにする必要があります。関数だけがプロトタイプを持っています。単なるタイプミスでない限り、JavaScriptでオブジェクトがどのように機能するかを確認する必要があります。このようになります。

goog.provide('sketcher');

goog.require('goog.dom');
goog.require('goog.graphics');
goog.require('goog.ui.Component');

/**
 * My sketcher widget.
 * @param {Element} e1
 * @constructor
 */
sketcher.Widget = function(el){
    goog.ui.Component.call(this);
    this.parent_ = goog.dom.getElement(el);

    this.g_ = new goog.graphics.createGraphics(600, 400);
    this.appendChild(this.g_);$

    var fill = new goog.graphics.SolidFill('yellow');
    var stroke = new goog.graphics.Stroke(1,'black');
    circle = this.g_.drawCircle(300, 200, 50, stroke, fill);
    this.g_.render(this._parent);
};
goog.inherits(sketcher.Widget, goog.ui.Component);

sketcher.prototype.load = function(){
    var canvas = goog.dom.createDom('div', {'id':'canvas'});
    goog.dom.appendChild(document.body, canvas);
    var widget = new sketcher.Widget(canvas);
};
于 2010-03-07T18:34:45.157 に答える
0

これは、クロージャーで構築された単純な svg 描画ウィジェットへのリンクです

http://webos-goodies.googlecode.com/svn/trunk/blog/articles/make_a_drawing_tool_with_closure_library/simple-draw.js

于 2010-02-21T15:56:03.140 に答える