zoukankan      html  css  js  c++  java
  • 关于amcharts 双排column的学习

    最近在项目中要用到amcharts,而且要求显示形式为双column,现举例如下:

    function getPurchaseChart(){
    $.get("income",{"areaId":"","flag":"4"},function(chartData){
    $("#purchaseChartDiv").html("");
    YSZE = 0;
    ZXZE = 0;
    ZXWCL = 0.0;
    $.each(chartData,function(i,data){
    $.each(data,function(key,value){
    if(key=="YSZE"){
    YSZE += value;
    }else if(key=="ZXZE"){
    ZXZE += value;
    }
    });
    });
    ZXWCL = ZXZE/YSZE;
    $("#cgzb").html(YSZE);
    $("#cgzx").html(ZXZE);
    $("#cgzxwcl").html(ZXWCL);
    $("#purchaseChartDiv").html("");
    // SERIAL CHART
    var chart = new AmCharts.AmSerialChart();
    chart.dataProvider = chartData;
    chart.categoryField = "QXMC";
    chart.startDuration = 1;
    chart.colors = [ "#4470A5"];

    // category
    var categoryAxis = chart.categoryAxis;
    categoryAxis.labelRotation = 0;
    categoryAxis.gridPosition = "start";
    // GRAPH,显示预算总额信息
    var graph = new AmCharts.AmGraph();
    graph.valueField = "YSZE";
    graph.balloonText = "[[category]]: [[value]]";
    graph.type = "column";
    graph.lineAlpha = 0;
    graph.fillAlphas = 0.8;
    graph.addListener("clickGraphItem", getTown2);
    chart.addGraph(graph);
    // GRAPH,显示执行总额信息
    var graph1 = new AmCharts.AmGraph();
    graph1.valueField = "ZXZE";
    graph1.balloonText = "[[category]]: [[value]]";
    graph1.type = "column";
    graph1.lineAlpha = 0;
    graph1.fillAlphas = 0.8;
    graph1.addListener("clickGraphItem", getTown3);
    chart.addGraph(graph1);
    // LEGEND,定义图例信息
    legend = new AmCharts.AmLegend();
    legend.align = "center";
    legend.position = "right";
    legend.markerType = "square";
    legend.valueWidth = 25;
    legend.valueText = "[[close]]";
    legend.labelText = "预算总额";
    chart.addLegend(legend);
    // legend1 = new AmCharts.AmLegend();
    // legend1.align = "center";
    // legend1.position = "right";
    // legend1.markerType = "square";
    // legend1.valueWidth = 25;
    // legend1.valueText = "[[open]]";
    // legend1.labelText = "执行总额";
    // chart.addLegend(legend1);

    chart.write("purchaseChartDiv");
    });
    }

    其实就是添加两个GRAPH。

  • 相关阅读:
    IE6实现PNG图片透明
    xp精简版 安装IIS
    CSS 多浏览器兼容又一方案
    mysql忘记root帐号和密码,修改root用户名和密码解决方案
    jQuery函数学习
    建立标准化的声明DOCTYPE和head
    关于Microsoft.XMLDOM 与Microsoft.XMLHTTP
    伪静态技术(较完整篇)
    关于document.cookie的使用
    鼠标滚动缩放图片效果
  • 原文地址:https://www.cnblogs.com/zhli/p/3061195.html
Copyright © 2011-2022 走看看