简单的写法,extjs可以直接引用插件来写,这里将我发表在百度文库的文档简述下来,有兴趣也可以关注我的百度文库,ID:该用户已失踪。

主要部分的代码:

$(document).ready(function(){
var myChart2 = echarts.init(document.getElementById('myChart2'));
var option = {
title: { //柱状图的表头
text: '时间、会员总数、总行程数和新增景点',
x:'center',
},
tooltip: {},
xAxis: {
data: ["出行时间","新增景点","总行程数","同比增长"]
},
yAxis:{},
series:[{
type:'bar',
data:[{
value:200,//单个高度值
itemStyle:{
normal:{color:'gray'} //单个柱状柱子的颜色
}
}, {
value:300,
itemStyle:{
normal:{color:'green'}
}
},{
value:1500,
itemStyle:{
normal:{color:'yellow'}
}
},{
value:300,
itemStyle:{
normal:{color:'red'}
}
}]
}]
} myChart2.setOption(option); })

2、引用的JS部分



3、HTML的内容



4、CSS部分

EXTjs开发————优雅的用extjs写一个柱状图的更多相关文章

  1. Java Web 开发利用Struts2+Spring+mybatis写一个用户登录界面以及简单的数据交互

    框架的东西太复杂也难以讲通,直接上代码: 一.首先得配置环境 和导入必要的jar包 有一些重要的如下: Filter文件夹下的SafetyFilter.java   model文件夹下的 Global ...

  2. ExtJS 开发总结

    1. ExtJS的定位是RIA,和Prototype.jQuery等类库的定位不同.使用ExtJS做开发,就是意味着以客户端开发为主,不然就不叫RIA框架了,而Prototype.jQuery等只是辅 ...

  3. 基于QT的webkit与ExtJs开发CB/S结构的企业应用管理系统

      一:源起       1.何为CB/S的应用程序       C/S结构的应用程序,是客户端/服务端形式的应用程序,这种应用程序要在客户电脑上安装一个程序,客户使用这个程序与服务端通信,完成一定的 ...

  4. Cordova webapp实战开发:(6)如何写一个iOS下获取APP版本号的插件?

    上一篇我们学习了如何写一个Andorid下自动更新的插件,我想还有一部分看本系列blog的开发人员希望学习在iOS下如何做插件的吧,那么今天你就可以来看看这篇文字了. 本次练习你能学到的 学习如何获取 ...

  5. Online Coding开发模式 (通过在线配置实现一个表模型的增删改查功能,无需写任何代码)

    JEECG 智能开发平台. 开发模式由代码生成器转变为Online Coding模式                      (通过在线配置实现一个表模型的增删改查功能,无需一行代码,支持用户自定义 ...

  6. Android开发技巧——写一个StepView

    在我们的应用开发中,有些业务流程会涉及到多个步骤,或者是多个状态的转化,因此,会需要有相关的设计来展示该业务流程.比如<停车王>应用里的添加车牌的步骤. 通常,我们会把这类控件称为&quo ...

  7. 开源一个Mac漂亮的小工具 PPRows for Mac, 在Mac上优雅的计算你写了多少行代码

    开源一个Mac漂亮的小工具 PPRows for Mac, 在Mac上优雅的计算你写了多少行代码. 开源地址: https://github.com/jkpang/PPRows

  8. 郑晔谈 Moco 框架的开发:写一个好的内部 DSL ,写一个表达性好的程序

    作者:张龙 出处:http://www.infoq.com/cn/news/2013/07/zhengye-on-moco 郑晔谈Moco框架的开发:写一个好的内部DSL,写一个表达性好的程序 作者  ...

  9. spring boot开发,jar包一个一个来启动太麻烦了,写一个bat文件一键启动

    spring boot开发,jar包一个一个来启动太麻烦了,写一个bat文件一键启动 @echo offcd D:\workProject\bushustart cmd /c "title ...

随机推荐

  1. Layui我提交表单时,table.reload(),表格会请求2次,是为什么?

    重载两次是因为搜索按钮用的是button 改成<a class="layui-btn" data-type="reload">搜索</a> ...

  2. Myeclipse创建HTML文件中文显示乱码问题

    例如 运行结果 错误原因 不同浏览器的,编码格式不同 解决方法 运行结果 通常charset的设值我们常用的有gb2312,gbk,utf-8三种,即有三种编码规定: <meta http-eq ...

  3. Java基础 -2.5

    布尔数据boolean类型 布尔类型的取值范围只有两个数据:true false. public class ddd { public static void main(String[] args) ...

  4. docker基础镜像ubuntu添加jdk1.8

    首先pull ubuntu18.04 docker pull ubuntu:18.04 下载jdk1.8 jdk-8u191-linux-x64.tar.gz 创建Dockerfile文件 编写文件如 ...

  5. highcharts Ajax 动态请求加载数据

    <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"% ...

  6. httpclient post 请求

    package com.thinkgem.jeesite.common.utils; import org.apache.http.HttpEntity; import org.apache.http ...

  7. 「SP10628 COT - Count on a tree」

    主席树的综合运用题. 前置芝士 可持久化线段树:其实就是主席树了. LCA:最近公共祖先,本题需要在\(\log_2N\)及以内的时间复杂度内解决这个问题. 具体做法 主席树维护每个点到根节点这一条链 ...

  8. 题解 CF165D 【Beard Graph】

    思路:将黑边标记为1,白边标记为100000,树链剖分 如果查询时ans超过100000,那就有白边,输出-1,不然直接输出ans #include<bits/stdc++.h> #def ...

  9. 使用Thymeleaf时,ajax的url如何设置?

    使用Thymeleaf时,ajax的url如何设置? 最近在做一个论坛项目使用到了Thymeleaf,在使用ajax请求的时候发现无法获取BasePath.在经过一番查阅资料后终于得知如下俩种方法,在 ...

  10. C#中集合接口关系笔记

    IEnumerable IEnumerable接口是所有集合类型的祖宗接口,其作用相当于Object类型之于其它类型.如果某个类型实现了IEnumerable接口,就意味着它可以被迭代访问,也就可以称 ...