創建一個簡單的繪圖區域小部件與谷歌關閉

Question

在這裏，我試圖創建一個簡單的繪圖區域小部件包含一個單一的圓圈，使用谷歌關閉。

我通過HTML腳本代碼中調用sketcher.load()加載它，並得到一個錯誤：

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); 
}; 

Answer 1

這裏是與封閉

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

Answer 2

第一個問題建立了一個簡單的SVG繪圖插件的鏈接：草繪是一個命名空間，因爲你goog.provide它。你不需要再次聲明它。

第二個問題：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); 
};