实例如下 :
<! DocType html public "-// w3c // dtd xhtml 1.0 strict // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"><htmlml xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>html+js+highcharts绘制圆饼图表的简单实例</title><script type="text/javascript" src = "jQuery-1.4.2.min.js"> </script> <script type = "text/javaScript" src = "HighCharts.js"> </script> </head> <body> <div id = "content"> <br> <br> <! $ (function () {var totalMoney = 999 <span style = "White-Space: PRE"> </span> var zccw = 178 <span style = "White-Space: PRE"> </span> var 'White', // 背景颜色 PlotBorderwidth: 0, PlotShadow: False}, Titel: {text: '总车位:'+TotalMoney+'剩余车位:'+sycw, verticalAnign: 'bottom', y: -60}, Tooltip: {// 鼠标移动到每个饼图显示的内容 Pointformat: '{point.name}: <b> {point.Percentage {b>}: <Bl. prozentuale Ereignisse: 1, Formatier: Funktion () {return this.point.name+':'+TotalMoney*this.point.Percentage/100; -50, // 通过设置这个属性 , 将每个小饼图的显示名称和每个饼图重叠 Style: {fontsize: '10px', lineHeight: '10px'}, Formatter: Funktion (Index) {return '<span style = "color:#00008b; font -weight: BOLD">' + this.point.name + '</span>'; Name: NULL, Daten: [{Name: '在场车辆', Farbe: '#3da9ff', y: ZCCW}, {Name: '剩余车位', Farbe: '008Fe0', y: sycw},}]}); </script> </div> </body> </html>以上这篇 HTML+JS+Highcharts 绘制圆饼图表的简单实例就是小编分享给大家的全部内容了 , 希望能给大家一个参考 , 也希望大家多多支持武林网。 也希望大家多多支持武林网。