快捷導(dǎo)航

jQuery插件HighCharts實(shí)現(xiàn)的2D對(duì)數(shù)餅圖效果示例【附demo源碼下載】

更新時(shí)間：2017年03月09日 08:56:12 作者：翱翔天地

這篇文章主要介紹了jQuery插件HighCharts實(shí)現(xiàn)的2D對(duì)數(shù)餅圖效果,結(jié)合實(shí)例形式分析了jQuery圖形插件HighCharts繪制2D對(duì)數(shù)餅圖的具體實(shí)現(xiàn)步驟與相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下

本文實(shí)例講述了jQuery插件HighCharts實(shí)現(xiàn)的2D對(duì)數(shù)餅圖效果。分享給大家供大家參考，具體如下：

1、實(shí)例代碼：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HighCharts 2D對(duì)數(shù)軸餅圖</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)對(duì)數(shù)軸餅圖'
  },
  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、運(yùn)行效果圖：

附：完整實(shí)例代碼點(diǎn)擊此處本站下載。

更多關(guān)于jQuery相關(guān)內(nèi)容感興趣的讀者可查看本站專題：《jQuery常用插件及用法總結(jié)》、《jquery中Ajax用法總結(jié)》、《jQuery表格(table)操作技巧匯總》、《jQuery擴(kuò)展技巧總結(jié)》、《jQuery常見經(jīng)典特效匯總》及《jquery選擇器用法總結(jié)》

希望本文所述對(duì)大家jQuery程序設(shè)計(jì)有所幫助。

您可能感興趣的文章:

相關(guān)文章

jQuery中attr()方法用法實(shí)例
這篇文章主要介紹了jQuery中attr()方法用法,實(shí)例分析了attr()方法的功能、定義及設(shè)置或返回匹配元素屬性值的使用技巧,需要的朋友可以參考下
2015-01-01
jQuery $命名沖突解決方案匯總
也許你在看此文章之前還不知道jquery有一個(gè)noConflict()東西了，它就是為了避免與其它js插件碰到相同變量的一個(gè)解決方法，利用noConflict()可以把變量存到其它指定的變量中去
2014-11-11
jQuery插件制作之全局函數(shù)用法實(shí)例
這篇文章主要介紹了jQuery插件制作之全局函數(shù)用法,實(shí)例分析了jQuery中全局函數(shù)的相關(guān)使用技巧,需要的朋友可以參考下
2015-06-06
jquery.post用法示例代碼
使用ajax在前端驗(yàn)證是否執(zhí)行某個(gè)操作，下面為大家介紹下jquery.post的具體使用
2014-01-01
jQuery層次選擇器選擇元素使用介紹
層次選擇器:通過DOM元素間的層次關(guān)系獲取元素，其主要的層次關(guān)系包括后代、父子、相鄰、兄弟關(guān)系，通過其中基類關(guān)系可以方便快捷地定位元素，感興趣的朋友可以了解下
2013-04-04
jquery對(duì)table做排序操作的實(shí)例演示
這篇文章主要介紹了jquery對(duì)table做排序操作的實(shí)例演示,通過添加自定義屬性data-sort-field-ftime及表頭添加onchange事件詳細(xì)講解了操作過程,需要的朋友可以參考下
2017-08-08
jquery自定義屬性(類型/屬性值)
屬性的類型可以為：圖片、文本框、按鈕，然后選擇需要設(shè)置的屬性值：src、width、height、title、value等等，具體實(shí)現(xiàn)如下，感興趣的朋友可以參考下哈
2013-05-05
jquery tabs的實(shí)現(xiàn)代碼
晚上有插件可以實(shí)現(xiàn)"jquery tab"，但有點(diǎn)復(fù)雜了，我想寫個(gè)最簡單的，來實(shí)現(xiàn)"jquery tab"。而事實(shí)上確實(shí)很簡練
2009-05-05
JQuery彈出炫麗對(duì)話框的同時(shí)讓背景變灰色
這篇文章主要介紹JQuery實(shí)現(xiàn)彈出炫麗對(duì)話框的同時(shí)讓背景變灰色效果,需要的朋友可以參考下
2014-05-05
jQuery模擬爆炸倒計(jì)時(shí)功能實(shí)例代碼
本文通過代碼給大家介紹了jQuery模擬爆炸倒計(jì)時(shí)功能實(shí)例代碼，非常不錯(cuò)，代碼簡單易懂，需要的朋友參考下吧
2017-08-08