jQuery插件HighCharts实现的2D对数饼图效果示例【附demo源码下载】


Posted in Javascript onMarch 09, 2017

本文实例讲述了jQuery插件HighCharts实现的2D对数饼图效果。分享给大家供大家参考,具体如下:

1、实例代码:

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HighCharts 2D对数轴饼图</title>
<script type="text/javascript" src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="js/highcharts.js"></script>
<script type="text/javascript">
$(function(){
 $('#logarithmicPieChart').highcharts({
  chart: {
  },
  title: {
   text: '(3water.com)对数轴饼图'
  },
  xAxis: {
   tickInterval: 2
  },
  yAxis: {
   type: 'logarithmic',
   minorTickInterval: 0.5
  },
  tooltip: {
   headerFormat: '<b>{series.name}</b><br />',
   pointFormat: 'x = {point.x}, y = {point.y}'
  },
  series: [{
   data: [1, 3, 9, 27, 81, 243, 729, 2187, 6561, 19683,59049,177147,531441,1594323],
   pointStart: 1
  }]
 });
 });
</script>
</head>
<body>
 <div id="logarithmicPieChart" style="width: 1200px; height: 500px; margin: 0 auto"></div>
</body>
</html>

2、运行效果图:

jQuery插件HighCharts实现的2D对数饼图效果示例【附demo源码下载】

Javascript 相关文章推荐
用javascript实现的图片马赛克后显示并切换加文字功能
Apr 21 Javascript
Jquery修改页面标题title其它JS失效的解决方法
Oct 31 Javascript
浅谈javascript中的instanceof和typeof
Feb 27 Javascript
JS实现点击按钮后框架内载入不同网页的方法
May 05 Javascript
HTML5之WebSocket入门3 -通信模型socket.io
Aug 21 Javascript
JavaScript简单实现鼠标移动切换图片的方法
Feb 23 Javascript
使用JavaScript实现弹出层效果的简单实例
May 31 Javascript
浅谈Cookie的生命周期问题
Aug 02 Javascript
jQuery学习之DOM节点的插入方法总结
Jan 22 Javascript
基于vue 动态加载图片src的解决方法
Feb 05 Javascript
Vue的Options用法说明
Aug 14 Javascript
vant中的toast层级改变操作
Nov 04 Javascript
JS实现课堂随机点名和顺序点名
Mar 09 #Javascript
JavaScript实现两个select下拉框选项左移右移
Mar 09 #Javascript
js实现年月日表单三级联动
Apr 17 #Javascript
js实现3D图片展示效果
Mar 09 #Javascript
JavaScript实现左右下拉框动态增删示例
Mar 09 #Javascript
less简单入门(CSS 预处理语言)
Mar 08 #Javascript
完美实现js选项卡切换效果(二)
Mar 08 #Javascript
You might like
消息持续发送的完整例子
2006/10/09 PHP
php HtmlReplace输入过滤安全函数
2010/07/03 PHP
PHP删除HTMl标签的实现代码
2013/06/30 PHP
PHP图片处理之使用imagecopyresampled函数裁剪图片例子
2014/11/19 PHP
隐性调用php程序的方法
2015/06/13 PHP
php实现用户登陆简单实例
2017/04/04 PHP
thinkphp5框架实现的自定义扩展类操作示例
2019/05/16 PHP
Thinkphp框架使用list_to_tree 实现无限级分类列出所有节点示例
2020/04/04 PHP
$.get获取一个文件的内容示例代码
2013/09/11 Javascript
比较不错的JS/JQuery显示或隐藏文本的方法
2014/02/13 Javascript
JSON+HTML实现国家省市联动选择效果
2014/05/18 Javascript
JS实现仿PS的调色板效果完整实例
2016/12/21 Javascript
JavaScript实现向select下拉框中添加和删除元素的方法
2017/03/07 Javascript
前端axios下载excel文件(二进制)的处理方法
2018/07/31 Javascript
Seajs源码详解分析
2019/04/02 Javascript
layui表单验证select下拉框实现验证的方法
2019/09/05 Javascript
vue自定义正在加载动画的例子
2019/11/14 Javascript
详解vue 组件
2020/06/11 Javascript
js实现贪吃蛇小游戏(加墙)
2020/07/31 Javascript
[04:59]DOTA2-DPC中国联赛 正赛 Ehome vs iG 选手采访
2021/03/11 DOTA
Django1.7+python 2.78+pycharm配置mysql数据库教程
2014/11/18 Python
Python的语言类型(详解)
2017/06/24 Python
python先序遍历二叉树问题
2017/11/10 Python
Python考拉兹猜想输出序列代码实践
2019/07/05 Python
TensorFlow2.0矩阵与向量的加减乘实例
2020/02/07 Python
python中threading和queue库实现多线程编程
2021/02/06 Python
html5教程画矩形代码分享
2013/12/04 HTML / CSS
维珍澳洲航空官网:Virgin Australia
2017/09/08 全球购物
法国滑雪假期的专家:Ski Planet
2019/11/02 全球购物
历史系毕业生自荐信
2013/10/28 职场文书
会计电算化个人自我评价
2013/11/17 职场文书
保洁主管岗位职责
2013/11/20 职场文书
总经理秘书工作职责
2013/12/26 职场文书
小学生优秀评语
2014/12/29 职场文书
小学学习委员竞选稿
2015/11/20 职场文书
Python实战之实现康威生命游戏
2021/04/26 Python