ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • ECharts - 방사형차트
    Chart 2019. 8. 29. 01:03

     

     

    var myChart = echarts.init(document.getElementById('main'));

     

                var option = {

                    tooltip: {

                        trigger: ‘axis’  /*환경지수: 25을 나타내기 위함. */

                    },

                    polar: [{

                        indicator: [{

                            text: '환경 지수',

                            max: 40

                        }, {

                            text: '신체 지수',

                            max: 40

                        }, {

                            text: '정신 지수',

                            max: 40

                        }, {

                            text: '정서감성 지수',

                            max: 40

                        }, {

                            text: '사회문화 지수',

                            max: 40

                        }, {

                            text: '재정 지수',

                            max: 40

                        }],

     

     

                         startAngle : 60    /* 그래프를 회전시킬 때  polar 안에서 startAngle과 회전시킬 숫자를 넣으면 그래프가 회전된다.*/

                    }],

     

                    

     

     

                    calculable: true,

                    series: [{

                        name: ' ',

                        type: 'radar',

                        itemStyle: {

                            normal: {

                                color: 'rgba(118,198,155,0.7)’,  /* itemStyle.normal 안에서 color: ‘rgba( 0,0,0, 0)’  그래프 안에 색상을 넣고 , 맨마지막 0.7은 투명도 */

                                areaStyle: {

                                    type: 'default',

     

                                }

     

                            }

                        },

                        data: [{

                            value: [array[5], array[0], array[1], array[2], array[3], array[4]],

                            /* F, A , B, C, D, E 순으로 */

     

     

                            name: ' '

                        }]

                    }]

                };

     

                // Load data into the ECharts instance 

                myChart.setOption(option);

Designed by Tistory.