1

我现在正在学习道场。所以我想通过如何在 Dojo 中使用仪表来构建我的第一个演示。我下载了 zip 包并构建了一个 asp.net 网络项目。然后将 Dojo 包中的所有资源导入到该项目中。

因为我从 DoJo 网站上看到了演示:http://demos.dojotoolkit.org/demos/gauges/demo.html 所以我想将这个演示复制到我的本地计算机中,并使用现有的 DoJo 资源。HTML 代码如下:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="DojoDaemon.Default" %>

<!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">
<head runat="server">
<title>Dojo Circular Gauge Test  Daemon</title>
<link href="Styles/Site.css" rel="stylesheet" type="text/css" />
<script src="Scripts/dojo-release-1.9.1/dojo/dojo.js" type="text/javascript"  data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/CircularLinearGauge.js"
    type="text/javascript" data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/HorizontalLinearGauge.js"
    type="text/javascript" data-dojo-config="async:true"></script>
<script src="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/SemiCircularLinearGauge.js"
    type="text/javascript" data-dojo-config="async:true"></script>
</head>
<body>
<form runat="server" id="form1">
<h2 align="center" style="color:white;">Predefined Glossy Gauges</h2>
<table style="height:100%; width:100%">
         <tr>
    <td align="center">
    <div id="CircularGauge" background="{color:'rgba(0,0,0,0)'}" useTooltip="false" data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/CircularLinearGauge" style="width:200px;height:200px" value="20"></div></td>
    <td align='center'>
    <div id="CircularGauge2" background="{color:'rgba(0,0,0,0)'}" useTooltip="false"  data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/SemiCircularLinearGauge" value="10" style="width:250px;height:200px"></div></td>
     </tr>
     <tr> 
     <td valign="middle" align="center" colspan="2">
    <div id="HGauge3" style="margin:30px 0px 0px 0px;width:400px;height:60px" useTooltip="false" background="{color:'rgba(0,0,0,0)'}"  data-dojo-type="Scripts/dojo-release-1.9.1/dojox/dgauges/components/black/HorizontalLinearGauge" value="20"></div></td>
    </tr>
</table>
</form>
</body>
 </html>

以上是我使用的代码,我搜索了很多示例,但一无所获,因为没有一篇文章给我详细的步骤来教我如何使用 dojox 文件夹中的资源。我发现的资源如下: http://dojotoolkit.org/api/dojox/dgauges/CircularGauge http://dmandrioli.github.io/dgauges/dojox/dgauges/CircularGauge.html 如果熟悉这个,有人会帮助我吗?非常感谢。

4

1 回答 1

1

您只需要在 src 中加载 dojo.js 和他们为演示包含的src.js。点击http://demos.dojotoolkit.org/demos/gauges/demo.html的查看源代码,复制代码!

Dojo 起初看起来像一头野兽,但它是一个漂亮的工具包,你会爱上并欣赏它。给它时间。我强烈建议您在跳到 dguage 和其他高级内容之前先跟Dojo打个招呼。

于 2013-09-14T20:58:33.000 回答