我一直致力于使用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