HighCharts之2D金字塔图
HighCharts之2D金字塔图
1、实例源码
Pyramid.html:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D金字塔图</title> <script type="text/javascript" src="../scripts/jquery-1.11.0.js"></script> <script type="text/javascript" src="../scripts/js/highcharts.js"></script> <script type="text/javascript"> $(function(){ $('#pyramidChart').highcharts({ chart: { type: 'pyramid', marginRight: 100 }, title: { text: '金字塔分布图', x: -50 }, plotOptions: { series: { dataLabels: { enabled: true, format: '<b>{point.name}</b> ({point.y:,.0f})', color: 'black', softConnector: true } } }, legend: { enabled: false }, series: [{ name: '人数', data: [ ['星期一',12], ['星期二',121], ['星期三',265], ['星期四',22131], ['星期五',623231], ['星期六',5545459], ['星期日',51245125] ] }] }); }); </script> </head> <body> <div id="pyramidChart" style="width: 1200px; height: 500px; margin: 0 auto"></div> </body> </html>
2、实例结果
HighCharts之2D金字塔图的更多相关文章
- HighCharts之2D面积图
HighCharts之2D面积图 1.HighCharts之2D面积图源码 <!DOCTYPE html> <html> <head> <meta char ...
- HighCharts之2D折线图
HighCharts之2D折线图 1.HighCharts之2D折线图源码 line.html: <!DOCTYPE html> <html> <head> < ...
- HighCharts之2D半圆环图
HighCharts之2D半圆环图 1.实例源码 HalfDonut.html: <!DOCTYPE html> <html> <head> <meta ch ...
- HighCharts之2D圆环图
HighCharts之2D圆环图 1.实例源码 Donut.html: <!DOCTYPE html> <html> <head> <meta charset ...
- HighCharts之2D数值带有百分数的面积图
HighCharts之2D数值带有百分数的面积图 1.HighCharts之2D数值带有百分数的面积图源码 AreaPercentage.html: <!DOCTYPE html> < ...
- HighCharts之2D堆面积图
HighCharts之2D堆面积图 1.HighCharts之2D堆面积图源码 StackedArea.html: <!DOCTYPE html> <html> <hea ...
- HighCharts之2D含有负值的面积图
HighCharts之2D含有负值的面积图 1.HighCharts之2D含有负值的面积图源码 AreaNegative.html: <!DOCTYPE html> <html> ...
- HighCharts之2D带Label的折线图
HighCharts之2D带Label的折线图 1.HighCharts之2D带Label的折线图源码 LineLabel.html: <!DOCTYPE html> <html&g ...
- HighCharts之2D堆条状图
HighCharts之2D堆条状图 1.HighCharts之2D堆条状图源码 StackedBar.html: <!DOCTYPE html> <html> <head ...
随机推荐
- C语言打印不出百分号'%'(以解决)
1. 问题描述 今天,我需要把百分号'%'打印出来,考虑到它是特殊符号,我就用转义字符'\',和它组合,结果是漆黑的屏幕什么也没有. 2. 解决办法 我问度娘, 她告诉我要打印百分号需要在它的前 ...
- JAVA中默认的编码方式
转:http://blog.csdn.net/scyatcs/article/details/31356823 编码问题存在两个方面:JVM之内和JVM之外.1.Java文件编译后形成class这里J ...
- Trusted Execution Technology (TXT) --- 基本原理篇
版权声明:本文为博主原创文章,未经博主允许不得转载. http://www.cnblogs.com/tsec/p/8409600.html 1. Intel TXT 介绍 TXT是Trusted Ex ...
- 常系数齐次线性递推 & 拉格朗日插值
常系数齐次线性递推 具体记在笔记本上了,以后可能补照片,这里稍微写一下,主要贴代码. 概述 形式: \[ h_n = a_1 h_{n-1}+a_2h_{n-2}+...+a_kh_{n-k} \] ...
- BZOJ 2005: [Noi2010]能量采集 [莫比乌斯反演]
题意:\((0,0)\)到\((x,y),\ x \le n, y \le m\)连线上的整点数\(*2-1\)的和 \((0,0)\)到\((a,b)\)的整点数就是\(gcd(a,b)\) 因为. ...
- 洛谷 P3672 小清新签到题 [DP 排列]
传送门 题意:给定自然数n.k.x,你要求出第k小的长度为n的逆序对对数为x的1~n的排列 $n \le 300, k \le 10^13$ 一下子想到hzc讲过的DP 从小到大插入,后插入不会对前插 ...
- Java随感
创新项目要用java,而我只大概会C++,只能靠自学咯~~~随时将一些重要的概念做笔记在这里吧>_< 1.一个源文件中只能有一个public类,一个源文件可以有多个非public类 2.所 ...
- python matplotlib 播放图片变化过程
最近想将原图片和处理后的图片放在一起观察图片的变化过程.但是网上并么有找到有用的示例代码,所以粘出来和大家分享一下. import numpy as np import matplotlib.pypl ...
- Discuz的安装与使用
Discuz的安装与使用 一.Discuz的安装 由于本机已经安装好XAMPP集成工具,后续Discuz访问数据库以及服务器等都是基于XAMPP环境.在主机localhost根目录下新建bbs文件夹. ...
- Golang学习 - strconv 包--数据类型转换
// 将布尔值转换为字符串 true 或 false func FormatBool(b bool) string // 将字符串转换为布尔值 // 它接受真值:1, t, T, TRUE, true ...