Dojo它提供了一个良好的仪表板显示器，的影响，如以下：

watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvR0lTU2hpWGlTaGVuZw==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

<!DOCTYPE html>

<html>

<head>

    <title>Dojo仪表盘</title>

    <meta charset="utf-8">

    <script src="http://192.168.240.186/arcgis_js_api/library/3.6/init.js"></script>

    <script type="text/javascript">

        var publicVariable=12;

        require(["dojox/dgauges/GaugeBase",

            "dojox/dgauges/components/default/CircularLinearGauge",

            "dojox/dgauges/components/classic/SemiCircularLinearGauge",

            "dojox/dgauges/components/classic/HorizontalLinearGauge",

            "dojox/dgauges/components/default/VerticalLinearGauge",

            "dojo/dom",

            "dojo/domReady!"

        ],

        function(

            GaugeBase,

            CircularLinearGauge,//圆形仪表

            SemiCircularLinearGauge,//半圆形仪表

            HorizontalLinearGauge,//横向刻度尺

            VerticalLinearGauge,//纵向刻度尺

            dom)

        {

            var watch1 = new CircularLinearGauge(//圆形仪表

                {

                    value:publicVariable,

                    animationDuration:1000

                },

                dom.byId("watch1")

            );

            var watch2 = new SemiCircularLinearGauge(//半圆形仪表

                    {

                        value:publicVariable,

                        animationDuration:1000

                    },

                    dom.byId("watch2")

            );

            var watch3 = new HorizontalLinearGauge(//横向刻度尺

                    {

                        value:publicVariable,

                        animationDuration:1000

                    },

                    dom.byId("watch3")

            );

            var watch4 = new VerticalLinearGauge(//纵向刻度尺

                    {

                        value:publicVariable,

                        animationDuration:1000

                    },

                    dom.byId("watch4")

            );

            setInterval(TriggerBackendData, 2000);

            function TriggerBackendData(){

                var value=GetRandomNum(0, 100);

                watch1.set("value", value);

                watch1.refreshRendering();

                watch2.set("value", value);

                watch2.refreshRendering();

                watch3.set("value", value);

                watch3.refreshRendering();

                watch4.set("value", value);

                watch4.refreshRendering();

            };

        });

        function GetRandomNum(Min,Max)

        {

            var Range = Max - Min;

            var Rand = Math.random();

            return(Min + Math.round(Rand * Range));

        }

    </script>

</head>

<body>

<div id="watch1" style="width:200px;height:200px" ></div><br />

<div id="watch2" style="width:200px;height:200px" ></div><br />

<div id="watch3" style="width:600px;height:50px; position: absolute; top: 50px; left: 500px;" ></div><br />

<div id="watch4" style="width:50px;height:600px; position: absolute; top: 10px; left: 300px;" ></div><br />

</body>

</html>

版权声明：本文博客原创文章。博客，未经同意，不得转载。

Dojo仪表板的更多相关文章

  1. AngularJs2与AMD加载器(dojo requirejs)集成

    现在是西太平洋时间凌晨,这个问题我鼓捣了一天,都没时间学英语了,英语太差,相信第二天我也看不懂了,直接看结果就行. 核心原理就是require在AngularJs2编译过程中是关键字,而在浏览器里面运 ...

  2. Dojo前端开发框架与jQuery前端开发框架，对比分析总结

    最近Dojo和jQuery双双发布了最新的1.8版本,有着相同版本号的两个Javascript库也有许多核心的相同之处:相同的资源加载机制AMD.相同的选择器 引擎Sizzle等.作为业界知名的Jav ...

  3. Dojo: Quick Start

      1.Dojo学习地址 2.Dojo快速开始 2.1.Dojo引入 2.2.指定Dojo模块的位置 2.3.模块加载require 3.查找Dom节点 3.1.根据id查找dom节点 3.2.根据c ...

  4. js库之dojo

    使用dojo源代码 1.下载Dojo 2.dojo目录结构如下 demo/ myModule.js dojo/ dijit/ dojox/ util/ hellodojo.html 3.引入dojo. ...

  5. dojo.require()的相关理解

    Dojo 提供了一个非常强大的javascript控件库. 在使用dojo之前,用户基本上不需要具备任何基础知识. 你可以用script远程链接到dojo(dojo.js), 也可以把dojo.js下 ...

  6. dojo tree edit的使用[前端]

    var store = new mydata.JsonRestStore({ target: "<%=ResolveUrl("~/uieditserver.ashx" ...

  7. 【原创】（AMD）JavaScript模块化开发（dojo）

    AMD原理等在这里就不进行说明了,作者也是菜鸟一枚,只是对自己的一个实例进行说明,如有错误,望指出. 首先,先推荐一篇AMD方面的文章,有兴趣的可以参考:http://efe.baidu.com/bl ...

  8. 开始学习Dojo

    学习:Dojo入门简易教程 Dojo Toolkit 简介 Dojo 于 2004 年创建,使开发 DHTML 和 JavaScript web 应用程序开发流程更为容易,隐藏了很多现代 web 浏览 ...

  9. understand dojo/domReady!

    require(["dojo/dom", "dojo/domReady!"], function(dom){ dom.byId("helloworld ...

随机推荐

  1. HDU 3065 病毒在继续 （AC自己主动机）

    中国标题不解释 Sample Input 3 AA BB CC ooxxCC%dAAAoen....END   Sample Output AA: 2 CC: 1 输出病毒出现的次数! #includ ...

  2. 13 于C#如何获得在IP住址

    首先,需要加入一个命名空间 using System.Net.NetworkInformation; using System.Net.Sockets; 以下是具体代码 GetPrivateIP(); ...

  3. Unity GUI选择与评价

    因为Unity内建的GUI不管是不是从开发效率或效率强制,因此,许多派生GUI插入,什么插件的选择,是一个非常值它被认为是. 既然是评价,就会有非常多的主观意识,这不一定成为选择的根据. 再比方.我已 ...

  4. Debian/Ubuntu 已安装gcc/g++ 4.8.1

    gcc 4.8.1 是第一个全然支持C++11(C++14非常可能在gcc 4.9.0開始支持.)的编译器,Windows上能够安装mingw版的.在sourceforge 上有下载.安装也比較方便. ...

  5. 了解大数据的技术生态系统 Hadoop,hive,spark(转载)

    首先给出原文链接: 原文链接 大数据本身是一个很宽泛的概念,Hadoop生态圈(或者泛生态圈)基本上都是为了处理超过单机尺度的数据处理而诞生的.你能够把它比作一个厨房所以须要的各种工具. 锅碗瓢盆,各 ...

  6. Ad Hoc

    Ad Hoc源自于拉丁语,意思是"for this"引申为"for this purpose only",即"为某种目的设置的,特别的"意思 ...

  7. Linux的NTP配置总结（转）

    在Linux系统中,为了避免主机时间因为在长时间运行下所导致的时间偏差,进行时间同步(synchronize)的工作是非常必要的.Linux系统下,一般使用ntp服务来同步不同机器的时间.NTP 是网 ...

  8. Play Framework + ReactiveMongo

    Play Framework + ReactiveMongo Play!是一个full-stack(全栈的)Java/Scala Web应用框架,包括一个简单的无状态MVC模型,具有Hibernate ...

  9. poj 3975&amp;&amp;hdu 1850 (nim)

    //赢得了上风 //从n几年移除堆叠一堆石头,有多少可取的石头堆 # include <stdio.h> # include <string.h> # include < ...

  10. 在InstallShield中发布单一的Setup.exe文件

    原文:在InstallShield中发布单一的Setup.exe文件 InstallShield默认的Release模式下,生成了一个setup.exe文件,一个msi文件,以及一些其它的杂项文件. ...