zoukankan      html  css  js  c++  java
  • highchart柱状堆叠图动态数据请求

    $(function () {
    var options = {
    chart: {
    renderTo: 'indoor',
    type: 'column',
    },
    title: {
    text: '室内问题'
    },
    xAxis: {
    categories: ['MR弱覆盖楼宇', '高2无4', '2G高倒挂', '投诉', '保障需求', '市场需求'],
    labels: {
    rotation:0
    }
    },
    yAxis: {
    max: 1000,
    min: 0,
    title: {
    text: ''
    },
    stackLabels: {
    enabled: true,
    style: {
    fontWeight: 'bold',
    color: (Highcharts.theme && Highcharts.theme.textColor) || 'gray'
    }
    }
    },
    legend: {
    align: 'right',
    x: -30,
    verticalAlign: 'top',
    y: 25,
    floating: true,
    backgroundColor: (Highcharts.theme && Highcharts.theme.background2) || 'white',
    borderColor: '#CCC',
    borderWidth: 1,
    shadow: false
    },
    tooltip: {
    formatter: function () {
    return '<b>' + this.x + '</b><br/>' +
    this.series.name + ': ' + this.y + '<br/>' +
    'Total: ' + this.point.stackTotal;
    }
    },
    plotOptions: {
    column: {
    pointWidth:'30',
    stacking: 'normal',
    dataLabels: {
    enabled: true,
    color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
    style: {
    textShadow: '0 0 3px black'
    }
    }
    }
    },
    series: [{
    name: '已提方案',
    data: [],
    color: '#FFA500'
    }, {
    name: '待提方案',
    data: [],
    color: '#228B22'
    }]
    };
    var newWithoutDemand =[];
    var newWithDemand =[];
    
    $.ajax({
    url: '/Public/StatIssueByBranch?BranchID=1&CellularTypeID=2',
    type: 'GET',
    dataType: 'json',
    success: function (data) {
    for(var i=0;i<data.length;i++){ 
    newWithoutDemand.push(data[i].WithoutDemand);
    newWithDemand.push(data[i].WithDemand);
    } 
    console.log('###')
    var obj = newWithDemand;
    var obj1 = newWithoutDemand;
    options.series[0].data = obj;    
    options.series[1].data = obj1;
    
    
    console.log(obj)
    console.log(obj1)
    
    chart = new Highcharts.Chart(options);   //这里顶部chart
    
    
    
    },
    error: function () {
    console.log(error)
    }
    });
    });

     下面是我的公众号,大家可以关注一下,可以一起学习,一起进步:

  • 相关阅读:
    lower_bound/upper_bound example
    Counter Mode ( CTR )
    85. Maximal Rectangle
    for_each(c++11)
    Lowest Common Ancestor in a Binary Tree
    python--基础学习(五)参数位置传递、关键字传递、包裹传递及解包裹(*args与**kwargs)
    Python的方法解析顺序(MRO)
    pycharm配置总结
    Python中内置数据类型list,tuple,dict,set的区别和用法
    进程号查找
  • 原文地址:https://www.cnblogs.com/lxl0419/p/6561582.html
Copyright © 2011-2022 走看看