调用Raphael自定义库

时间:2012-07-07 04:37:15

标签: javascript jquery raphael

我一直致力于使用Raphael通过html页面中的脚本创建某个规格。但现在我想用js脚本调用它。我不知道该怎么做。但我正在尝试的是失败。以下是我的所作所为。

XHTML:

<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://java.sun.com/jsf/html">
    <h:head>
        <script language="javascript" type="text/javascript" src="raphael-min.js"></script>
        <!-- Raphael 1.5.2 - JavaScript Vector Library -->
        <script language="javascript" type="text/javascript" src="vmgauge.js"></script>
        <!-- vmGauge JavaScript. -->
    </h:head>
    <h:body onload="ready();">
        <h:form>
            <div id="jGaugeDemo"></div>
        </h:form>
    </h:body>
    <script type="text/javascript">
        var myGauge = new vmGauge('jGaugeDemo');

        function ready() {
            // Create a new jGauge.
            myGauge.init(); // Put the jGauge on the page by initialising it.
            // myGauge.setValue(7.35);
        };
    </script>

</html>

vmgauge.js:

vmGauge = function(id) {
    alert("id");
    this.id = id;
    this.minAngle = -225;
    this.maxAngle = 45;
    this.width = 200;
    this.height = 200;
    this.suffix = '%';
    this.prefix = '';
    this.imagePath = 'img/jgauge_face_taco.png';
    var needleDefault = {
        imagePath: 'img/jgauge_needle_taco.png',
        width: '',
        height: ''
    }

        function needle() {
            var needle = this;
            needle.width = this.width;
            needle.height = this.height;
        }
    this.needle = new needle(); } vmGauge.prototype.init = function () {
    this.root = document.getElementById(this.id);
    alert("got the doc");
    this.paper = Raphael(this.id, this.width, this.height);
    this.paper.image("img/jgauge_face_taco.png", 0, 0, paper.width, paper.height); }

以下是我从谷歌Chrome控制台获取的错误

  

未捕获的ReferenceError:未定义id vmgauge.js:1(匿名   function)vmgauge.js:1未捕获的ReferenceError:未定义vmGauge   vmgauage.xhtml:35(匿名函数)vmgauage.xhtml:35

0 个答案:

没有答案