echarts横向柱状图如果想打开网址

Posted 2021-01-18 raitorei

代码：

var data = eval(data);
var xList = new Array();
var yList = new Array();
var urlList = new Array();
for (var j = data.length - 1; j > -1; j--) {
    var url = data[j].url;
    xList.push(url.substr(0, 1) + "**" + url.substr(3, url.length));
    urlList.push(url);
    yList.push(data[j].cnt);
}
var dom = document.getElementById("id");
var myChart = echarts.init(dom);
option = {
    color: [‘#51ffff‘],
    title: {
        x: ‘center‘,
        textStyle: {
            color: ‘green‘
        }
    },
    tooltip: {
        trigger: ‘axis‘,
        axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: ‘shadow‘ // 默认为直线，可选为：‘line‘ | ‘shadow‘
        }
    },
    grid: {
        top: ‘1%‘,
        left: ‘3%‘,
        right: ‘12%‘,
        bottom: ‘9%‘,
        containLabel: true
    },
    yAxis: [{
        type: ‘category‘,
        data: xList,
        axisLine: {
            lineStyle: {
                color: ‘#fff‘,
                width: 1, //这里是为了突出显示加上的
            }
        }
    }],
    xAxis: [{
        type: ‘value‘,
        splitLine: {
            show: true,
            lineStyle: {
                color: ["#fff"],
                type: ‘shadow‘
            }
        },
        axisLine: {
            lineStyle: {
                color: ‘#fff‘,
                width: 1, //这里是为了突出显示加上的
            }
        },
        axisLabel: {
            interval: 1, //横轴信息全部显示  
            rotate: -30, //-15度角倾斜显示  
        },
    }],
    series: [{
        name: ‘访问量‘,
        type: ‘bar‘,
        data: yList
    }]
};
myChart.setOption(option, true);

myChart.on("click", eConsole);
function eConsole(capacity) {
    var name = ‘‘;
    for (var j = data.length - 1; j > -1; j--) {
        if (data[j].cnt == capacity.value) {
            name = data[j].url;
            break;
        }
    }
    var re = /^(d+).(d+).(d+).(d+)$/; //是否为IP
    if (re.test(name)) {
        window.open("http://" + name);
    } else {
        window.open("http://www." + name);
    }
}