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.

You only need to load dojo.js in the src and the src.js which they have included for the demo. Click on the View Source of http://demos.dojotoolkit.org/demos/gauges/demo.html and copy the code exactly!

Dojo can seem like a beast at first, but its a beautiful toolkit that you will come to love and appreciate. Give it time. I STRONGLY recommend you say Hi to Dojo before jumping to dguage and other advanced stuff.