实例如下 :
< xmlns = "http://www.w3.org/1999/xhtml"> <fead> <meta http-equiv = "content-type" content = "text/html; charset = gb2312"/> <title> html+js+highcharts 绘制圆饼图表的简单实例 </scripty> type = "text/jawrcript" src = "jQuery-1.4.2.min.js"> </script> <script type = "text/javaScript" src = "highcharts.js"> </script> </head> <body> <div id = "content"> <br> <br> <br> <!-start de demostración-> <din Id = "PII_CHART"> </div> <script type = "text/jawtrcript"; $ (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',, Countbacker 'White', // 背景颜色 PlotBorDerWidth: 0, PlotShadow: False}, Título: {Text: '总车位:'+TotalMoney+'剩余车位:'+Sycw, VerticalAlign: 'Bottom', y: -60}, Tooltip: {// 鼠标移动到每个饼图显示的内容 PointFormat: '{Point.Name}: <B> porcentaje de porcentaje: 1, formatter: function () {return this.point.name+':'+TotalMoney*this.Point.PERCENTAGE/100; -50, // 通过设置这个属性 将每个小饼图的显示名称和每个饼图重叠 将每个小饼图的显示名称和每个饼图重叠 estilo: {fontSize: '10px', lineHeight: '10px'}, formatter: function (index) {return '<span style = "color:#00008b; font -weight: bold">' + this.name.name + '</span>; Nombre: NULL, DATOS: [{nombre: '在场车辆', color: '#3DA9ff', y: ZCCW}, {Nombre: '剩余车位', color: '#008fe0', y: sycw},]}]}); </script> </div> </body> </html>以上这篇 HTML+JS+HighCharts 绘制圆饼图表的简单实例就是小编分享给大家的全部内容了 , , 也希望大家多多支持武林网。