jQuery插件HighCharts实现的2D对数饼图效果示例【附demo源码下载】
本文实例讲述了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: '(jb51.net)对数轴饼图' }, 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相关内容感兴趣的读者可查看本站专题:《jQuery常用插件及用法总结》、《jquery中Ajax用法总结》、《jQuery表格(table)操作技巧汇总》、《jQuery扩展技巧总结》、《jQuery常见经典特效汇总》及《jquery选择器用法总结》
希望本文所述对大家jQuery程序设计有所帮助。
相关推荐
-
jQuery插件HighCharts绘制2D半圆环图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D半圆环图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D半圆环图</title> <script type="text/javascript" src="js/jquer
-
jQuery插件HighCharts绘制2D柱状图、折线图的组合双轴图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D柱状图.折线图的组合双轴图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D柱状图.折线图的组合双轴图</title> <script type="text/javascript"
-
jQuery插件HighCharts实现2D柱状图、折线图的组合多轴图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts实现2D柱状图.折线图的组合多轴图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D柱状图.折线图的组合多轴图</title> <script type="text/javascript"
-
jQuery插件HighCharts实现的2D回归直线散点效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts实现的2D回归直线散点效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts之2D回归直线的散点</title> <script type="text/javascript" src="js
-
jQuery插件HighCharts绘制2D金字塔图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D金字塔图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D金字塔分布图</title> <script type="text/javascript" src="js/jqu
-
jQuery插件HighCharts实现气泡图效果示例【附demo源码】
本文实例讲述了jQuery插件HighCharts实现气泡图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 气泡图</title> <script type="text/javascript" src="js/jquery-1.7.
-
jQuery插件HighCharts绘制的基本折线图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制的基本折线图效果.分享给大家供大家参考,具体如下: 1. 实例源码: <!DOCTYPE html> <html> <head> <title>HighCharts基本折线图</title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-w
-
jQuery插件HighCharts绘制2D带Label的折线图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D带Label的折线图效果.分享给大家供大家参考,具体如下: 1.示例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D带Label的折线图</title> <script type="text/javascript" src=&q
-
jQuery插件HighCharts绘制的2D堆柱状图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制的2D堆柱状图效果.分享给大家供大家参考,具体如下: 1.HighCharts之2D堆柱状图源码 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D堆柱状图</title> <script type="text/javascript" src
-
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D圆环图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D圆环图</title> <script type="text/javascript" src="js/jquery-
-
jQuery插件HighCharts绘制2D带有Legend的饼图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D带有Legend的饼图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D带有Legend的饼图</title> <script type="text/javascript" src=
-
jQuery插件HighCharts绘制2D柱状图、折线图和饼图的组合图效果示例【附demo源码下载】
本文实例讲述了jQuery插件HighCharts绘制2D柱状图.折线图和饼图的组合图效果.分享给大家供大家参考,具体如下: 1.实例代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HighCharts 2D柱状图.折线图和饼图的组合图</title> <script type="text/javascript"
随机推荐
- win2008,Windows2008安全,限制匿名访问设置方法
- 详解VirtualBox + CentOS 虚拟机网卡配置
- springMVC配置环境实现文件上传和下载
- Python中函数及默认参数的定义与调用操作实例分析
- Docker的安装方法及运行Docker Swarm模式的使用
- mysql 将字段time按天/月/年分组
- node.js中的console.error方法使用说明
- sql server实现递归查询的方法示例
- MySQL自增列插入0值的解决方案
- Java策略模式的简单应用实现方法
- java教程之java注解annotation使用方法
- 基于JavaScript实现移动端TAB触屏切换效果
- JavaScript判断变量是对象还是数组的方法
- python中实现将多个print输出合成一个数组
- 基于Java文件输入输出流实现文件上传下载功能
- 使用vue如何构建一个自动建站项目
- PostgreSQL树形结构的递归查询示例
- 一篇文章弄懂kotlin的扩展方法
- 浅谈pycharm的xmx和xms设置方法
- python实现while循环打印星星的四种形状