dojo单柱状图

1、dojo单柱状图源码

column.html：

<!DOCTYPE HTML>
<html lang="en">
	<head>
<![endif]>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>单柱状图</title>
        <style type="text/css">
            @import "../dojoroot/dojo/resources/dojo.css";
            @import "../dojoroot/dijit/tests/css/dijitTests.css";
            @import "../dojoroot/dijit/themes/claro/claro.css";
			@import "../dojoroot/dojox/charting/resources/Legend.css";
        </style>

        <script type="text/javascript" src="../dojoroot/dojo/dojo.js" data-dojo-config="isDebug: true, parseOnLoad: true"></script>
        <script type="text/javascript">
            dojo.require("dijit.dijit");
            dojo.require("dojox.charting.Chart");
            dojo.require("dojox.charting.axis2d.Default");
            dojo.require("dojox.charting.plot2d.Columns");
			dojo.require("dojox.charting.themes.ThreeD");
			dojo.require("dojox.charting.widget.SelectableLegend");
        	dojo.addOnLoad(function(){
				var columnsChart = new dojox.charting.Chart("columns").
					setTheme(dojox.charting.themes.ThreeD).
					addPlot("default",{type: "Columns",gap:2}).
					addAxis("y",{natural: true, includeZero: true, vertical:true}).
					addAxis("x",{natural: true}).
					addSeries("月销售量",[24,56,35,96,45,12,78,48,52,20,34,71,40,38,28,74,50,70,10,90,24,56,35,96,45,12,78,48,85,67]).
					render();
				var columnsLegend = new dojox.charting.widget.SelectableLegend({chart: columnsChart},"columnsLegend");
				new dojox.charting.action2d.Shake(columnsChart, "default", {shiftY: 0});
		        new dojox.charting.action2d.Tooltip(columnsChart);
			})

        </script>
    </head>
    <body class="claro" style="width:96%;height:100%; text-align: center;">
		<h2 style="text-align: center;">柱状图</h2>
		<div id="columns" class="columns" style="width:1200px;height:400px;"></div>
		<div id="columnsLegend" style="text-align: center; width:100%;"></div>
    </body>
</html>

2、运行结果

（1）初始化时

（2）取消勾选复选框

dojo单柱状图的更多相关文章

  1. Scrapy爬取猫眼《复仇者联盟4终局之战》影评

    一.分析 首先简单介绍一下Scrapy的基本流程: 引擎从调度器中取出一个链接(URL)用于接下来的抓取 引擎把URL封装成一个请求(Request)传给下载器 下载器把资源下载下来,并封装成应答包( ...

  2. DOJO 如何清空表单

          在Dojo里,清空表单非常简单 在设置好了相关的环境之后,只要设置dom.byId('formid').reset(); / dijit.byId('formid').reset; Jqu ...

  3. 编写单例的 dojo class

    define([ "dojo/_base/declare" ],function( declare ){ var TimeChartService = declare(" ...

  4. dojo中引入FusionCharts柱状图报错

    1.今天,做项目的过程中,我发现Java后台查询的数据都是正确的,并且拼接成JSON格式也正确,但是传到JSP页面时,图无法显示出来还报错,后来经过检查发现是JavaScript和引入FusionCh ...

  5. jQuery学习之：Validation表单验证插件

    http://polaris.blog.51cto.com/1146394/258781/ 最近由于公司决定使用AJAX + Struts2来重构项目,让我仔细研究一下这两个,然后集中给同事讲讲,让每 ...

  6. 开始学习Dojo

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

  7. Dojo

    dojo的类机制支持类声明.继承.调用父类方法等功能.dojo在底层实现上是通过操作原型链来实现其类机制的,而在实现继承时采用类式继承的方式.值得一提的是,dojo的类机制允许进行多重继承(注意,只有 ...

  8. Dojo框架学习笔记<二>

    一.dojo/dom    该模块定义了Dojo Dom API,主要有以下几种用法:    1.dom.byId();(相当于document.getElementById())    ①最直接的用 ...

  9. 《静静的dojo》 总体教程介绍

    web2.0时代,ajax技术成为整个前端开发领域的基石.大部分的书籍.博客由此切入来介绍前端类库与框架,所以dojo往往只被当做一个ajax类库来介绍,然而仅仅以此来定位dojo,无异于管中窥豹.对 ...

随机推荐

  1. C语言对函数操作的结果声明

    可以用来返回给调用者函数操作的状态值. /* 这是一份关于函数返回值定义的头文件. */ #ifndef _STATUS_H_ #define _STATUS_H_ #define STATUS in ...

  2. 使用hexo搭建个人博客

    安装前提 node.js git 如果缺少以上条件,则前往相应的官网下载安装即可.. 安装hexo $ npm install hexo-cli -g 待安装完成后,执行相关命令查看hexo的信息. ...

  3. Spring源码解析一（框架梳理）

    整体架构 打算开始写这个系列,不为上首页,也不为博取多少关注,只有一个目的:梳理知识,扩充思路:废话不多,开始吧.第一步,大家去spring的官方github下面去下载它的源码,具体的自己谷歌,我已经 ...

  4. jQuery控制input只能输入两位数字和小数（金额）

    function num(obj){ obj.value = obj.value.replace(/[^\d.]/g,""); //清除"数字"和". ...

  5. Dell服务器R320在Centos6.5系统上安装MegaCli管理主板集成磁盘阵列卡

    折腾了两天啊,我的神啊,,终于可以安装了 针对Dell服务器的R320版本主板集成的磁盘阵列卡,需要下载MegaCli 8或更新版本 下载链接: http://pan.baidu.com/s/1mgB ...

  6. [eslint-plugin-vue] [vue/no-unused-vars] 'scope' is defined but never used.

    前言 今天在做项目的时候Visual Studio Code报了一个错 这个错的意思是声明了scope却没有使用它,这是vue的eslink插件检测的. 我想这个scope的属性不是自己的吗,咋是我声 ...

  7. iOS-Xcode编码自动补全失效

    1. 退出 Xcode 2. 重启电脑 3. 找到 这个 DerivedData 文件夹 删除 (路径: ~/Library/Developer/Xcode/DerivedData) 4. 删除这个 ...

  8. python爬虫（2）——编写一个爬虫

    一.URL的编码与解码 在python2中包含的urllib和urllib2,都是接受URL请求相关的模块.但是在python3中,却没有urllib2.实际上urllib2的功能在python3中可 ...

  9. 发送POST测试请求的若干方法

    最近在工作中需要测试发送带Json格式body值的HTTP POST请求.起初,我在Linux环境下使用curl命令去发送请求,但是,在发送的过程中却遇到了一些问题,经过一段时间的摸索,发现了以下几种 ...

  10. docker 报错：x509: certificate has expired or is not yet valid

    环境:centos 7 程序:docker 下载镜像报错: # docker pull centos Pulling repository centos FATA[0004] Get https:// ...