How to use dojox tools in DoJo?
I am now learning Dojo. So I want to build my first demo by how to use
gauges in Dojo. I downloaded the zip package and build an asp.net web
project. then all the resources from Dojo package are imported to this
project.
Because I saw the demo from DoJo website:
http://demos.dojotoolkit.org/demos/gauges/demo.html, So I want to copy
this demo in my local computer with existing DoJo resources. HTML code
below:
<%@ 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>
Above is the code I use, I have searched a lot of examples, but got
nothing because no one article give me the detailed steps to teach me how
to use the resources in dojox folder. resources I found like :
http://dojotoolkit.org/api/dojox/dgauges/CircularGauge
http://dmandrioli.github.io/dgauges/dojox/dgauges/CircularGauge.html Would
anyone help me if familar with this? thank you ver much.
No comments:
Post a Comment