zuel-itsm-3.0.2/assets/js/controllers/means/assetMap.js

app.controller('meansmapCtrl', ["$scope", function($scope) {
    // var myChart = echarts.init(document.getElementById('meansmap'));
    var dom = document.getElementById("meansmap");
    var myChart = echarts.init(dom);
    var app = {};
    option = null;
    myChart.showLoading();


    var data2 = [{
        name: "治安管理工作",
        label: {
            normal: {
                backgroundColor: '#725bb8'
            }
        },
        children: [{
            name: "娱乐场所治安管理",
            children: [{
                name: "娱乐场所治安管理工作"
            }]
        }, {
            name: "安保工作",
            children: [{
                name: "输油气管道安保工作"
            }, {
                name: "校园安保工作"
            }, {
                name: "节假日、重大活动、大型群众性活动安保和敏感期社会面管控工作"
            }]
        }, {
            name: "精神病人管控工作",
            children: [{
                name: "精神病人肇事肇祸案事件"
            }]
        }, {
            name: "物流寄递业",
            children: [{
                name: "物流寄递业治安管理工作"
            }]
        }, {
            name: "推进基层基础工作创新",
            children: [{
                name: "加强派出所建设"
            }]
        }, {
            name: "地网建设工作",
            children: [{
                name: "加强二轮电动车防盗登记备案装置安装工作"
            }]
        }, {
            name: "无人机管理",
            children: [{
                name: "加强无人机管理"
            }]
        }, {
            name: "加强社会面巡逻防控",
            children: [{
                name: "武装联勤巡逻"
            }]
        }]
    }];

    myChart.hideLoading();
    // echarts.util.each(data2.children, function(datum, index) {
    //     index % 2 === 0 && (datum.collapsed = true);
    // });
    myChart.setOption(option = {
        backgroundColor: '#02246d',
        tooltip: {
            trigger: 'item',
            triggerOn: 'mousemove'
        },
        legend: {
            top: '2%',
            left: '3%',
            orient: 'vertical',
            data: [{
                name: 'tree1',
                icon: 'rectangle'
            }],
            borderColor: '#c23531'
        },
        series: [{
            type: 'tree',
            name: '治安管理工作',
            data: data2,
            top: '5%',
            left: '7%',
            bottom: '2%',
            right: '60%',

            symbolSize: 7,

            // label: {
            //     normal: {
            //         position: 'left',
            //         verticalAlign: 'middle',
            //         align: 'right'
            //     }
            // },
            label: {
                normal: {
                    position: 'center',
                    verticalAlign: 'middle',
                    align: 'left',
                    backgroundColor: '#7049f0',
                    color: '#fff',
                    padding: 3,
                    formatter: [
                        '{box|{b}}'
                    ].join('\n'),
                    rich: {
                        box: {
                            top: 5,
                            height: 30,
                            color: '#fff',
                            padding: [0, 5],
                            align: 'center'
                        }
                    }
                }
            },
            leaves: {
                label: {
                    normal: {
                        position: 'center',
                        verticalAlign: 'middle',
                        align: 'left',
                        backgroundColor: '#c44eff',
                        formatter: [
                            '{box|{b}}'
                        ].join('\n'),
                        rich: {
                            box: {
                                height: 18,
                                color: '#fff',
                                padding: [0, 5],
                                align: 'center'
                            }
                        }
                    }
                }
            },
            expandAndCollapse: true,
            animationDuration: 550,
            animationDurationUpdate: 750
                // },
                // {
                //     type: 'tree',
                //     name: '危爆物品管理工作',
                //     data: data2,
                //     top: '1%',
                //     right: '50%',
                //     symbolSize: 1,
                //     initialTreeDepth: 10,
                //     label: {
                //         normal: {
                //             position: 'center',
                //             verticalAlign: 'middle',
                //             align: 'left',
                //             backgroundColor: '#7049f0',
                //             color: '#fff',
                //             padding: 3,
                //             formatter: [
                //                 '{box|{b}}'
                //             ].join('\n'),
                //             rich: {
                //                 box: {
                //                     height: 30,
                //                     color: '#fff',
                //                     padding: [0, 5],
                //                     align: 'center'
                //                 }
                //             }
                //         }
                //     },
                //     leaves: {
                //         label: {
                //             normal: {
                //                 position: 'center',
                //                 verticalAlign: 'middle',
                //                 align: 'left',
                //                 backgroundColor: '#c44eff',
                //                 formatter: [
                //                     '{box|{b}}'
                //                 ].join('\n'),
                //                 rich: {
                //                     box: {
                //                         height: 18,
                //                         color: '#fff',
                //                         padding: [0, 5],
                //                         align: 'center'
                //                     }
                //                 }
                //             }
                //         }
                //     },
                //     expandAndCollapse: true,
                //     animationDuration: 550,
                //     animationDurationUpdate: 750
        }]
    });
    myChart.on('legendselectchanged', function(params) {
        // 获取点击图例的选中状态
        var isSelected = params.selected[params.name];
        // 在控制台中打印
        console.log((isSelected ? '选中了' : '取消选中了') + '图例' + params.name);
        // 打印所有图例的状态
        console.log(params.selected);
    })
    if (option && typeof option === "object") {
        myChart.setOption(option, true);
    }
}])