转载 “新时代“主题图谱

效果图

//跳转代码
myChart.on('click', function(params) {
    console.log(params.name);
    window.open(params.data.url);
    // window.open('https://www.baidu.com/s?wd=' + encodeURIComponent(params.value));
});

var colorList = [[
    '#ff7f50', '#87cefa', '#da70d6', '#32cd32', '#6495ed',
    '#ff69b4', '#ba55d3', '#cd5c5c', '#ffa500', '#40e0d0',
    '#1e90ff', '#ff6347', '#7b68ee', '#d0648a', '#ffd700',
    '#6b8e23', '#4ea397', '#3cb371', '#b8860b', '#7bd9a5'
    ],
    [
    '#ff7f50', '#87cefa', '#da70d6', '#32cd32', '#6495ed',
    '#ff69b4', '#ba55d3', '#cd5c5c', '#ffa500', '#40e0d0',
    '#1e90ff', '#ff6347', '#7b68ee', '#00fa9a', '#ffd700',
    '#6b8e23', '#ff00ff', '#3cb371', '#b8860b', '#30e0e0'
    ],
    [
    '#929fff', '#9de0ff', '#ffa897', '#af87fe', '#7dc3fe',
    '#bb60b2', '#433e7c', '#f47a75', '#009db2', '#024b51', 
    '#0780cf', '#765005', '#e75840', '#26ccd8', '#3685fe', 
    '#9977ef', '#f5616f', '#f7b13f', '#f9e264', '#50c48f'
    ]][2];

option = {
    // 图表标题
    title: {
        show:true,//显示策略,默认值true,可选为:true(显示) | false(隐藏)
        text: '"新时代"主题图谱',//主标题文本,'\n'指定换行
        x: 'center',        // 水平安放位置,默认为左对齐,可选为:
                          // 'center' ¦ 'left' ¦ 'right'
                          // ¦ {number}(x坐标,单位px)
        y: 'bottom',             // 垂直安放位置,默认为全图顶端,可选为:
                          // 'top' ¦ 'bottom' ¦ 'center'
                          // ¦ {number}(y坐标,单位px)
        //textAlign: null          // 水平对齐方式,默认根据x设置自动调整
        backgroundColor: 'rgba(0,0,0,0)',
        borderColor: '#ccc',    // 标题边框颜色
        borderWidth: 0,         // 标题边框线宽,单位px,默认为0(无边框)
        padding: 5,             // 标题内边距,单位px,默认各方向内边距为5,
                                // 接受数组分别设定上右下左边距,同css
        itemGap: 10,            // 主副标题纵向间隔,单位px,默认为10,
        textStyle: {
            fontSize: 18,
            fontWeight: 'bolder',
            color: '#333'        // 主标题文字颜色
        },
        subtextStyle: {
            color: '#aaa'        // 副标题文字颜色
        }
    },
    backgroundColor: '#fff',
    tooltip: {},
    animationDurationUpdate: function(idx) {
        // 越往后的数据延迟越大
        return idx * 100;
    },
    animationEasingUpdate: 'bounceIn',
    color: ['#fff', '#fff', '#fff'],
    series: [{
        type: 'graph',
        layout: 'force',
        force: {
            repulsion: 500,
            edgeLength: 10
        },
        roam: true,
        label: {
            normal: {
                show: true
            }
        },
        data: [{
            "name": "新冠肺炎愈后一般6个月内不会再得",
            "value": 2373,
            "symbolSize": 48,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[0],
                    "color": colorList[0]
                }
            }
        }, {
            "name": "女篮两连胜后大喊武汉加油",
            "value": 5449,
            "symbolSize": 73,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[1],
                    "color": colorList[1]
                }
            }
        }, {
            "name": "火神山医院开微博",
            "value": 2289,
            "symbolSize": 67,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[2],
                    "color": colorList[2]
                }
            }
        }, {
            "name": "医疗队女队员集体理平头和光头",
            "value": 2518,
            "symbolSize": 50,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[3],
                    "color": colorList[3]
                }
            }
        }, {
            "name": "缅怀疫情中逝去的人们",
            "value": 4730,
            "symbolSize": 88,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[4],
                    "color": colorList[4]
                }
            }
        }, {
            "name": "妨害疫情防控的违法行为",
            "value": 1952,
            "symbolSize": 55,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[5],
                    "color": colorList[5]
                }
            }
        }, {
            "name": "66岁重症患者8天快速康复",
            "value": 926,
            "symbolSize": 70,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[6],
                    "color": colorList[6]
                }
            }
        }, {
            "name": "别让快递小哥一直等在寒风中",
            "value": 4536,
            "symbolSize": 67,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[7],
                    "color": colorList[7]
                }
            }
        }, {
            "name": "湖北以外地区新增病例数连降5天",
            "value": 750,
            "symbolSize": 47,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[8],
                    "color": colorList[8]
                }
            }
        }, {
            "name": "女儿写给战疫一线爸爸的信",
            "value": 493,
            "symbolSize": 82,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[9],
                    "color": colorList[9]
                }
            }
        }, {
            "name": "青海连续3天无新增病例",
            "value": 385,
            "symbolSize": 59,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[10],
                    "color": colorList[10]
                }
            }
        }, {
            "name": "辽宁再派1000名医护人员驰援武汉",
            "value": 4960,
            "symbolSize": 90,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[11],
                    "color": colorList[11]
                }
            }
        }, {
            "name": "抗击新型肺炎第一线",
            "value": 8694000,
            "symbolSize": 134,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[12],
                    "color": colorList[12]
                }
            }
        }, {
            "name": "12项疫情防控惠民政策",
            "value": 5668,
            "symbolSize": 75,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[13],
                    "color": colorList[13]
                }
            }
        }, {
            "name": "战疫一线的别样团圆",
            "value": 339,
            "symbolSize": 68,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[14],
                    "color": colorList[14]
                }
            }
        }, {
            "name": "31省区市心理援助热线",
            "value": 671,
            "symbolSize": 62,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[15],
                    "color": colorList[15]
                }
            }
        }, {
            "name": "元宵节亮灯为武汉加油",
            "value": 27000,
            "symbolSize": 114,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[16],
                    "color": colorList[16]
                }
            }
        }, {
            "name": "抗击新型肺炎我们在行动",
            "value": 10777000,
            "symbolSize": 130,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[17],
                    "color": colorList[17]
                }
            }
        }, {
            "name": "疫情中的逆行者",
            "value": 92000,
            "symbolSize": 123,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[18],
                    "color": colorList[18]
                }
            }
        }, {
            "name": "一张图看懂新冠肺炎",
            "value": 20000,
            "symbolSize": 141,
            "draggable": true,
            "itemStyle": {
                "normal": {
                    "shadowBlur": 100,
                    "shadowColor": colorList[19],
                    "color": colorList[19]
                }
            },
            "url": "https://gallery.echartsjs.com/preview.html?c=xPLngHx_Z&v=1"
        }]
    }]
}
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值