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 相关文章推荐
又一个小巧的图片预加载类
May 05 Javascript
js操作模态窗口及父子窗口间相互传值示例
Jun 09 Javascript
JavaScript中的splice方法用法详解
Jul 20 Javascript
巧用jQuery选择器提高写表单效率的方法
Aug 19 Javascript
KnockoutJS 3.X API 第四章之表单value绑定
Oct 10 Javascript
使用微信内嵌H5网页解决JS倒计时失效问题
Jan 13 Javascript
javascript数据类型详解
Feb 07 Javascript
Vue监听数据对象变化源码
Mar 09 Javascript
微信小程序分页加载的实例代码
Jul 11 Javascript
浅谈关于axios和session的一些事
Jul 13 Javascript
JS遍历DOM文档树的方法实例详解
Apr 03 Javascript
解决v-for中使用v-if或者v-bind:class失效的问题
Sep 25 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
解决中英文字符串长度问题函数
2007/01/16 PHP
php下删除字符串中HTML标签的函数
2008/08/27 PHP
PHP自动选择 连接本地还是远程数据库
2010/12/02 PHP
php mysql_real_escape_string addslashes及mysql绑定参数防SQL注入攻击
2016/12/23 PHP
PHP水印类,支持添加图片、文字、填充颜色区域的实现
2017/02/04 PHP
利用jQuery的deferred对象实现异步按顺序加载JS文件
2013/03/17 Javascript
dwz 如何去掉ajaxloading具体代码
2013/05/22 Javascript
Javascript实现计算个人所得税
2015/05/10 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
2016/04/18 Javascript
JS实现页面载入时随机显示图片效果
2016/09/07 Javascript
值得分享和收藏的xmlplus组件学习教程
2017/05/05 Javascript
JavaScript使用readAsDataURL读取图像文件
2017/05/10 Javascript
基于vue cli 通过命令行传参实现多环境配置
2018/07/12 Javascript
Angular2使用SVG自定义图表(条形图、折线图)组件示例
2019/05/10 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
Node.js设置定时任务之node-schedule模块的使用详解
2020/04/28 Javascript
Vue切换Tab动态渲染组件的操作
2020/09/21 Javascript
python中二维阵列的变换实例
2014/10/09 Python
详解Python中的序列化与反序列化的使用
2015/06/30 Python
python解决Fedora解压zip时中文乱码的方法
2016/09/18 Python
Python管理Windows服务小脚本
2018/03/12 Python
Python第三方库face_recognition在windows上的安装过程
2019/05/03 Python
Pytorch之contiguous的用法
2019/12/31 Python
BeautifulSoup获取指定class样式的div的实现
2020/12/07 Python
css3 position fixed固定居中问题解决方案
2014/08/19 HTML / CSS
有趣的睡衣和礼物:LazyOne
2019/11/27 全球购物
英国运动服、设备及配件网站:DW Sports
2019/12/04 全球购物
毕业生个人求职的自我评价
2013/10/28 职场文书
网页美工求职信
2014/02/15 职场文书
运动会稿件50字
2014/02/17 职场文书
企业标语口号
2014/06/10 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
小学教师年度个人总结
2015/02/05 职场文书
三八妇女节新闻稿
2015/07/17 职场文书
springcloud整合seata
2022/05/20 Java/Android
Redis入门基础常用操作命令整理
2022/06/01 Redis