关键字：Highcharts

<!DOCTYPE HTML>

<html>

    <head>

        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

        <title>Highcharts Example</title>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

        <script type="text/javascript">

            var content = {

                title: {

                    text: 'Monthly Average Temperature',

                    x: -20 //center

                },

                subtitle: {

                    text: 'Source: WorldClimate.com',

                    x: -20

                },

                xAxis: {

                    categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun',

                        'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec']

                },

                yAxis: {

                    title: {

                        text: 'Temperature (°C)'

                    },

                    plotLines: [{

                        value: 0,

                        width: 1,

                        color: '#808080'

                    }]

                },

                tooltip: {

                    valueSuffix: '°C'

                },

                legend: {

                    layout: 'vertical',

                    align: 'right',

                    verticalAlign: 'middle',

                    borderWidth: 0

                },

                series: [{

                    name: 'Tokyo',

                    data: [7.0, 6.9, 9.5, 14.5, 18.2, 21.5, 25.2, 26.5, 23.3, 18.3, 13.9, 9.6]

                }, {

                    name: 'New York',

                    data: [-0.2, 0.8, 5.7, 11.3, 17.0, 22.0, 24.8, 24.1, 20.1, 14.1, 8.6, 2.5]

                }, {

                    name: 'Berlin',

                    data: [-0.9, 0.6, 3.5, 8.4, 13.5, 17.0, 18.6, 17.9, 14.3, 9.0, 3.9, 1.0]

                }, {

                    name: 'London',

                    data: [3.9, 4.2, 5.7, 8.5, 11.9, 15.2, 17.0, 16.6, 14.2, 10.3, 6.6, 4.8]

                }]

            }

            $(function () {

                $('#container').highcharts(content);

            });

        </script>

    </head>

    <body>

        <script src="http://code.highcharts.com/highcharts.js"></script>

        <script src="http://code.highcharts.com/modules/exporting.js"></script>

        <div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

    </body>

</html>

一个Highcharts的例子的更多相关文章

  1. 用一个简单的例子来理解python高阶函数

    ============================ 用一个简单的例子来理解python高阶函数 ============================ 最近在用mailx发送邮件, 写法大致如 ...

  2. Spring-Context之一:一个简单的例子

    很久之前就想系统的学习和掌握Spring框架,但是拖了很久都没有行动.现在趁着在外出差杂事不多,就花时间来由浅入深的研究下Spring框架.Spring框架这几年来已经发展成为一个巨无霸产品.从最初的 ...

  3. 高仿“点触验证码”做的一个静态Html例子

    先上源码: <html> <head> <title>TouClick - Designed By MrChu</title> <meta htt ...

  4. 关于apriori算法的一个简单的例子

    apriori算法是关联规则挖掘中很基础也很经典的一个算法,我认为很多教程出现大堆的公式不是很适合一个初学者理解.因此,本文列举一个简单的例子来演示下apriori算法的整个步骤. 下面这个表格是代表 ...

  5. 一个UWSGI的例子

    摘要:uwsgi执行顺序:启动master进程,执行python脚本的公共代码(import同一层).然后生成worker进程,uwsgi.post_fork_hook=init_functions, ...

  6. 扩展Python模块系列(二)----一个简单的例子

    本节使用一个简单的例子引出Python C/C++ API的详细使用方法.针对的是CPython的解释器. 目标:创建一个Python内建模块test,提供一个功能函数distance, 计算空间中两 ...

  7. fitnesse - 一个简单的例子（slim）

    fitnesse - 一个简单的例子(slim) 2017-09-30 目录1 编写测试代码(Fixture code)2 编写wiki page并运行  2.1 新建wikiPage  2.2 运行 ...

  8. Struts2的配置和一个简单的例子

    Struts2的配置和一个简单的例子 笔记仓库:https://github.com/nnngu/LearningNotes 简介 这篇文章主要讲如何在 IntelliJ IDEA 中使用 Strut ...

  9. 一个简单的例子搞懂ES6之Promise

    ES5中实现异步的常见方式不外乎以下几种: 1. 回调函数 2. 事件驱动 2. 自定义事件(根本上原理同事件驱动相同) 而ES6中的Promise的出现就使得异步变得非常简单.promise中的异步 ...

随机推荐

  1. 用WebCollector爬取站点的图片

    用WebCollector爬取整站图片,仅仅须要遍历整站页面.然后将URL为.jpg.gif的页面(文件)保存到本地就可以. 比如我们爬取一个美食站点,获取里面全部的图片: import cn.edu ...

  2. AndroidStaggeredGrid

    https://github.com/etsy/AndroidStaggeredGrid

  3. [React] Creating a Stateless Functional Component

    Most of the components that you write will be stateless, meaning that they take in props and return ...

  4. Io_Language

    Object ancestor := method ( prototype := self proto if (prototype != Obejct, writeln ("Slots of ...

  5. svn出错错误

    RA layer request failed ---------------------------- 解决方案:重启visulsvnserver 若重启不了 出现Service 'VisualSV ...

  6. cglib源码分析（二）：Class name 生成策略

    一.如何获取动态生成的class 字节码 结合生成的class文件是一个学习cglib的比较好的方法.在cglib中,生成的class文件默认只存储在内存中,我们可以在代码中加入下面语句来获取clas ...

  7. Adapter 适配器模式

    将一个类的接口转换成客户希望的另外一个接口.Adapter模式使得原本由于接口不兼容而不能一起工作的那些类可以在一起工作. 目标接口(Target):客户所期待的接口.目标可以是具体的或抽象的类,也可 ...

  8. YII中URL地址美化

    URL地址美化:urlManager地址管理(通过程序来实现url的地址美化) 例如: 原地址:http://localhost/项目/app/index.php?r=控制器/方法 新地址:http: ...

  9. spring定时任务的配置

    定时任务配置分为三个步骤: 1.定义任务 2.任务执行策略配置 3.启动任务 1.定义任务 <!--要定时执行的方法--> <bean id="testTaskJob&qu ...

  10. swift－01－简述swift与OC区别

    swift语言 Swift是Apple在WWDC2014所发布的一门编程语言,用来撰写OS X和iOS应用程序[1].在设计Swift时．就有意和Objective-C共存,Objective-C是A ...