在线教育相关

描述:当前是关于Echarts图表中的 关系图 示例。
 
            

option = {
        backgroundColor: '#efefef',
 
        tooltip: { trigger: 'item',
            
            formatter: function (params) { 
                var info = '<p style="font-size:18px">' + params.name +
                '</p><p style="font-size:14px">老师评价</p>' 
             
                return info; 
            }, 
            backgroundColor: "#e69c7e",
            textStyle: { color: "#fff" }
           
        
        },
        animationDurationUpdate: 1500,
        animationEasingUpdate: 'quinticInOut',
        color:['#83e0ff','#45f5ce','#b158ff'],
        series: [
            {
                type: 'graph',
                layout: 'force',
                force:{
                    repulsion:1000,
                    edgeLength:50
                },
                roam: true,
                label: {
                    normal: {
                        show: true
                    }
                },
                data: [
                    {
                        name: '在线教育相关人群',
                    item:'shihua',
                        symbolSize: 120,
                        
                        draggable: true,
                        category: 0,
                        itemStyle: {
                            
                            
                            normal: {
                                borderColor: '#e69c7e',
                                borderWidth: 6,
                                shadowBlur: 20,
                                shadowColor: '#fff1e6',
                                color: '#fdc498',
                            }
                        }
                    },
                    {
                        name: '用户',
                        title :'wejf',
                        symbolSize: 100,
                        itemStyle: {
                            normal: {
                                borderColor: '#7bb099',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#aee0ca',
                                color: '#fdc498',
                            }
                        },
                        category: 1,

                    },
                    {
                        name: '学生',
                        symbolSize: 80,
                        category: 1,
                        itemStyle: {
                            normal: {
                                borderColor: '#8be995',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#aee0ca',
                                color: '#fdc498',
                            }
                        },

                    },
                    {
                        name: '家长',
                        symbolSize: 80,
                        category: 1,
                        itemStyle: {
                            normal: {
                                borderColor: '#65c7cb',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#aee0ca',
                                color: '#fdc498',
                            }
                        },

                    },
                    {
                        name: '老师',
                        symbolSize: 80,
                        category: 1,
                        itemStyle: {
                            normal: {
                                borderColor: '#89b879',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#aee0ca',
                                color: '#fdc498',
                            }
                        },

                    },
                    {
                        name: '业内人士',
                        symbolSize:100,
                        category: 2,
                        itemStyle: {
                            normal: {
                                borderColor: '#5878b0',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#bbd2f9',
                                color: '#fdc498',
                            }
                        },

                    },
                    {
                        name: '教育评论人',
                        symbolSize:80,
                        category: 2,
                        itemStyle: {
                            normal: {
                                borderColor: '#9f8fff',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#bbd2f9',
                                color: '#fdc498'
                            }
                        },

                    },
                    {
                        name: '教育主管部门',
                        symbolSize:80,
                        itemStyle: {
                            normal: {
                                borderColor: '#bbd2f9',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#bbd2f9',
                                color: '#fdc498'

                            }
                        },
                        category: 2,

                    },
                    {
                        name: '教育专家',
                        symbolSize:80,
                        itemStyle: {
                            normal: {
                                borderColor: '#5ba6e2',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#bbd2f9',
                                color: '#fdc498'
                            }
                        },
                        category: 2,

                    },
                    {
                        name: '在线教育平台方',
                        symbolSize:80,
                        category: 2,
                        itemStyle: {
                            normal: {
                                borderColor: '#85acff',
                                borderWidth: 4,
                                shadowBlur: 10,
                                shadowColor: '#bbd2f9',
                                color: '#fdc498'
                            }
                        },

                    }],
                links: [
                    {
                        source: '在线教育相关人群',
                        target: '用户'

                    },
                    {
                        source: '在线教育相关人群',
                        target: '业内人士',
                    },
                    {
                        source: '用户',
                        target: '学生',
                    },
                    {
                        source: '用户',
                        target: '家长',
                    },
                    {
                        source: '用户',
                        target: '老师',
                    },
                    {
                        source: '在线教育相关人群',
                        target: '业内人士', 
                    },
                    {
                        source: '业内人士',
                        target: '在线教育平台方',
                    },
                    {
                        source: '业内人士',
                        target: '教育评论人',
                    },
                    {
                        source: '业内人士',
                        target: '教育主管部门',
                        value: 'DNA',
                    },{
                        source: '业内人士',
                        target: '教育专家'
                        
                    }
                ],
                lineStyle: {
                    normal: {
                        opacity: 0.9,
                        width: 5,
                        curveness: 0
                    }
                },
                categories:[
                    {name: '0'},
                    {name: '1'},
                    {name: '2'}
                ]
            }
        ]
    }