码迷,mamicode.com
首页 > 其他好文 > 详细

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

时间:2018-11-09 14:20:16      阅读:123      评论:0      收藏:0      [点我收藏+]

标签:city   指示   echarts   lse   isp   ==   tom   series   int   

代码:

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);
    }
}

 

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

标签:city   指示   echarts   lse   isp   ==   tom   series   int   

原文地址:https://www.cnblogs.com/raitorei/p/9934741.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!