xmnk
/
wkshi


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
							<html>
    <head>
        <meta charset="utf-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1" />
        <script src="lib/esl.js"></script>
        <script src="lib/config.js"></script>
        <script src="lib/jquery.min.js"></script>
    </head>
    <body>
        <style>
            html, body, #main {
                width: 100%;
                padding: 0;
                margin: 0;
                height: 100%;
            }
        </style>
        <div id="main"></div>
        <script>
            require([
                'echarts'
                // 'echarts/chart/tree',
                // 'echarts/component/tooltip'
                ], function (echarts) {
                    var chart = echarts.init(document.getElementById('main'), null, {

                    });

                    window.onresize = function () {
                        chart.resize();
                    };

                    $.getJSON('./data/flare.json')
                    .done(function (data) {

                        echarts.util.each(data.children, function (datum, index) {
                            index % 2 === 0 && (datum.collapsed = true);
                        });

                        chart.setOption({

                            tooltip: {
                                trigger: 'item',
                                triggerOn: 'mousemove'
                            },

                            series:[
                                {
                                    type: 'tree',

                                    data: [data],

                                    top: '1%',
                                    left: '7%',
                                    bottom: '1%',
                                    right: '20%',

                                    symbolSize: 7,
                                    // initialTreeDepth: -1,
                                    label: {
                                        normal: {
                                            position: 'left',
                                            verticalAlign: 'middle',
                                            align: 'right'
                                        }
                                    },

                                    leaves: {
                                        label: {
                                            normal: {
                                                position: 'right',
                                                verticalAlign: 'middle',
                                                align: 'left'
                                            }
                                        }
                                    },

                                    expandAndCollapse: true,
                                    animationDuration: 550,
                                    animationDurationUpdate: 750
                                }
                            ]
                        });
                    });
                });
        </script>
    </body>
</html>