前言

：
Small make up doing recently graphics display the function of the,With the help of all the commonly usedHighcharts,This blog small make up to summarize the application of the project:

核心

代码

/**Updates to the project**/
    function updataFactoryPlainData(){



    $('#factionPlainCharts').highcharts({
            chart: {
                type: 'pie',
                height:'200'
            },
            yAxis: {
                title: {
                    text: ''
                }
            },
            colors:[
                '#90EE7E',//第一个颜色 浅绿
                '#F7A35C',//第二个颜色 橘黄
                '#FA8072',//The third color 品红
                '#DDDF00',//The fourth color 黄色
                '#32CD32' //The fifth color 绿色
            ],
            //Disable the export modules
            exporting:{
                enabled:false
            },
            //Data column configuration
            legend: {
            layout: 'vertical',
            align: 'right',
            verticalAlign: 'top',
            borderWidth: 0

        },
         plotOptions: {
                pie: {
                    shadow: false,
                    center: ['40%', '30%'],  //The pie chart center
                    showInLegend:true
                }
            },
            tooltip: {
                valueSuffix: ''  //数据提示框 中 Data suffix
            },
            title:'',
            //Shielding the copyright information
            credits:{
                enabled:false
            },
            series: [{
                name: '数量',
                data: D_3_1_inner,
                size: '80%',
                dataLabels: {
                    enabled:false
                }
            }, {
                name: '数量',
                data: D_3_1_outer,
                size: '80%',
                innerSize: '80%',
                dataLabels: {
                    enabled:false
                },
                id: 'versions'
            }]
        });

    }

/**His work plan**/
                innerData = data.D_3_1.innerData;
                outterData = data.D_3_1.outterData;
                for( i=0;i<innerData.length;i++){

                    D_3_1_inner.push({
                          name: innerData[i].name,
                          y:innerData[i].value
                    });
                }
                for( i=0;i<outterData.length;i++){

                    D_3_1_outer.push({
                          name: outterData[i].name,
                          y:outterData[i].value
                    });
                }

效果图

官方文档:
https://api.hcharts.cn/highcharts

总结

感谢读者的阅读