一个标准的ECharts代码

<!DOCTYPE html>
<head>
    <meta charset="utf-8">
    <title>ECharts</title>
</head>
<body>
    <!-- 为ECharts准备一个具备大小(宽高)的Dom -->
    <div id="main" style="height:400px"></div>
    <!-- ECharts单文件引入 -->
    <script src="http://echarts.baidu.com/build/dist/echarts.js"></script>
    <script type="text/javascript">
        // 路径配置
        require.config({
            paths: {
                echarts: ‘http://echarts.baidu.com/build/dist‘
            }
        });

        // 使用
        require(
            [
                ‘echarts‘,
                ‘echarts/chart/bar‘ // 使用柱状图就加载bar模块,按需加载
            ],
            function (ec) {
                // 基于准备好的dom,初始化echarts图表
                var myChart = ec.init(document.getElementById(‘main‘)); 

                var option = {
                    tooltip: {
                        show: true
                    },
                    legend: {
                        data:[‘销量‘]
                    },
                    xAxis : [
                        {
                            type : ‘category‘,
                            data : ["衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子"]
                        }
                    ],
                    yAxis : [
                        {
                            type : ‘value‘
                        }
                    ],
                    series : [
                        {
                            "name":"销量",
                            "type":"bar",
                            "data":[5, 20, 40, 10, 10, 20]
                        }
                    ]
                };

                // 为echarts对象加载数据
                myChart.setOption(option);
            }
        );
    </script>
</body>
时间: 2024-10-29 19:09:45

一个标准的ECharts代码的相关文章

在32位PE文件中的任意一个节中添加代码

// SectionOp.cpp : 定义控制台应用程序的入口点. // /************************************************ *程序说明:在32位PE文件中的任意一个节中添加代码 *          第一个参数为PE文件 第二个参数为第N个节 * * 时间: 20170718 * Win10 VS2010 测试通过  ver 0.01 **************************************************/ #inc

配合m2eclipse创建一个标准的maven web项目

1.maven安装 首先下载maven3. 解压后设置maven的系统变量. 如下图.设置好M2_HOME和PATH的系统变量.输入  Java代码   mvn -version ------------------------------------------------------------------------------------------ 2.安装m2eclipse插件 m2eclipse Core Update Site: http://m2eclipse.sonatype

VB6 如何创建一个标准控制台程序

打开 VB6 并新建一个标准EXE程序,把窗口删掉,然后再加入一个模块. 在模块中加入AllocConsole.FreeConsole.SetConsoleTitle.Sleep的API声明: Public Declare Function AllocConsole Lib "kernel32.dll" () As LongPublic Declare Function FreeConsole Lib "kernel32.dll" () As LongPublic

【转】C# 串口操作系列(1) -- 入门篇,一个标准的,简陋的串口例子。

我假设读者已经了解了c#的语法,本文是针对刚打算解除串口编程的朋友阅读的,作为串口编程的入门范例,也是我这个系列的基础. 我们的开发环境假定为vs2005(虽然我在用vs2010,但避免有些网友用2005,不支持lambda,避免不兼容,就用2005来做例子) 一个基本的串口程序,既然是个程序了.我们就先从功能说起,包含 串口选择 波特率选择 打开 关闭 接受数据显示 发送数据输入 发送数据 数据量提示以及归零 好吧,有了这些功能,我们就先画出界面.例如: 这里,波特率就定死几种好了.直接界面上

一个女大学生的代码学习之路(二)

首先说一下,写这种文章是由于我在四月四日晚上,在手动搭建自己的第一个ssh项目的时候,遇到了一个配置的问题,怎么解决也弄不好,当时是四号晚上九点,我看了一眼表,我就想两个小时之内,我要是能搞定就算行了,但是其实,我搞到三点才OK(凌晨),那时候已经是五号了,转天是一家子去扫墓的时候,结果我居然以这种一个理由没有去,理由是我太累了么?我只是就是搭了一个架子,就是由于我的包太混乱了,导致不兼容,所以tomcat总也不启动,你可能认为好笑,这么简单一个问题怎么就费这多多时间呢,但是作为一个刚接触三框架

Eclipse SWT开发教程以及一个连连看游戏的代码实现下载

原创整理不易,转载请标明出处:Eclipse SWT开发教程以及一个连连看游戏的代码实现下载 代码下载地址:http://www.zuidaima.com/share/1772672482675712.htm 我在前面讲过:如果讲GUI编程一味只讲各个控件的使用方法,那么纯粹是浪费大家时间,如果出书,那绝对是骗钱的.所以我并不会详细地讲解SWT各个控件的具体使用方法.然而的众所周知,Eclipse的UI界面是建立在SWT基础之上的,如果一字不提SWT,似乎也不大可能.SWT是一个优秀的GUI编程

做了一个简易的git 代码自动部署脚本

项目是THINKPHP写的 用了 oschina git 进行版本管理. 公网服务器是CentOS.每次用FTP上传很麻烦. 所以想到了在服务器上安装一个GIT进行 pull代码.因为我的远程服务器数据库和本地不一样,所以代码pull后还需要修改 几个config.php数据库配置文件. 所以想再git 代码更新后,要自动执行config.php文件的替换或者修改. 其中看到这里讨论http://www.v2ex.com/t/81173  git hook 然后看了下比较麻烦.也看不懂. 所以就

javascript删除一个html元素节点代码实例

javascript删除一个html元素节点代码实例:本章节介绍一下如何利用原生javascript实现删除一个指定的html元素.代码实例如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title&

让文本框前端出现一个小图标的CSS代码

<title>让文本框前端出现一个小图标的CSS代码</title><style type="text/css">.searchBox{ background-image:url('/jscss/demoimg/200906/glass.gif'); background-repeat:no-repeat; padding-left:20px;}form{ display:inline;}</style><input type=&q