：
<! Doctype html public "- // w3c // dtd xhtml 1.0 strict // en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd"><html xmlns = "http://www.w3.org/1999/xhtml"> <éad> <méta http-equiv = "contenu-type" contenu = "Text / html; Charset = gb2312" /> <tdical> 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> <br> <! - Demo start -> <div id = "Pie_Chart"> </v> <v> <! Script = "Text / Javascript"> Var; $(function () { var totalMoney=999<span style="white-space:pre"></span>var zccw=178<span style="white-space:pre"></span>var sycw=821 $(document).ready(function() { chart = new Highcharts.Chart({ chart: { renderTo: 'pie_chart', plotBackgroundColor: 'White', // 背景颜色 PlotborderWidth: 0, Plotshadow: false}, titre: {text: '总车位:' + totalmoney + '剩余车位:' + sycw, verticalalign: 'inférieur', y: -60}, toolttip: {// 鼠标移动到每个饼图显示的内容 Pointformat: '{point.name}: <b> {point.percent} 1, format: function () {return this.point.name + ':' + totalmoney * this.point.percentage / 100;}}, tracé, {Pie: {size: '60% ', borderwidth: 0, allowPointSelect: true' -50, // 通过设置这个属性 ， 将每个小饼图的显示名称和每个饼图重叠 Style: {FonTSize: '10px', lineheight: '10px'}, format: fonction (index) {return '<span style = "Color: # 00008b; Font-Weight: Bold">' + this.point.name + '</pan>'; 'Pie', Name: Null, Data: [{Name: '在场车辆', Color: '# 3DA9FF', Y: ZCCW}, {Name: '剩余车位', Color: '# 008FE0', Y: SyCW},]}]}); </cript> </div> </ body> </html>以上这篇 HTML + JS + HIGHCARTS 绘制圆饼图表的简单实例就是小编分享给大家的全部内容了 ， 希望能给大家一个参考 ， 也希望大家多多支持武林网。