1. Add reference highcharts. js and exporting. js
2. The front-end code is as follows. related parameters can be configured from the backend and load is supported.
$ (Function () {$ ('# resinfoview '). highcharts ({// Chart display container, consistent with Div ID chart: {type: 'pie '// specifies the chart type. The default value is line.}, title: {text: 'total resource capacity $! Totalsize '// specify the chart title}. tooltip: {// 2 indicates that it is precise to the second digit after the decimal point. formatter: function () {return' <B> '+ this. point. name + '</B>:' + highcharts. numberformat (this. percentage, 2) + '%'; }}, series: [{// set the color, name, and percentage type of each small pie chart: 'pie ', name: NULL, data: [{Name: 'image $! Picsize ', color:' # 3da9ff ', Y: $! Picrate}, {Name: 'documentation $! Docsize ', color:' #008fe0 ', Y: $! Docrate}, {Name: 'video $! Videosize ', color:' # 00639b ', Y: $! Videorate}, {Name: 'others $! Othersize ', color:' # cbecff ', Y: $! Otherrate}]});
Create a hightcharts pie chart