0

以下是我拥有的代码。在此代码中，我静态地给出值。现在我需要做的是我需要获取动态值并且必须显示图表。在这里进入项目变量我必须以相同的方式从控制器获取值并且必须显示图表。谢谢。

 <!DOCTYPE html>
    <html>
    <head>
      <script src="http://www.amcharts.com/lib/amcharts.js" type="text/javascript"></script>

    </head>
    <body>
  <div id="chartdiv" style="width: 100%; height: 355px;"></div>
 <script type="text/javascript" language="javascript">
var chart;

var chartData = [{
    year: "FY 2011-12",
    visits: 3025
    },
{
    year: "FY 2011-12",
    visits: 1882
    },
{
    year: "FY 2011-12",
    visits: 1809
    },
{
    year: "FY 2011-12",
    visits: 1322
    }
    }];


AmCharts.ready(function() {
    // SERIAL CHART
    chart = new AmCharts.AmSerialChart();
    chart.autoMarginOffset = 0;
    chart.dataProvider = chartData;
    chart.categoryField = "year";
    chart.startDuration = 1;
    chart.depth3D = 20;
    chart.angle = 30;

    // AXES
    // category
    var categoryAxis = chart.categoryAxis;
    categoryAxis.labelRotation = 45; // this line makes category values to be rotated
    categoryAxis.gridAlpha = 0;
    categoryAxis.fillAlpha = 1;
    categoryAxis.fillColor = "#FAFAFA";
    categoryAxis.gridPosition = "start";

    // value
    var valueAxis = new AmCharts.ValueAxis();
    valueAxis.dashLength = 5;
    valueAxis.title = "Visitors from country";
    valueAxis.axisAlpha = 0;
    chart.addValueAxis(valueAxis);

    // GRAPH
    var graph = new AmCharts.AmGraph();
    graph.valueField = "visits";
    graph.colorField = "color";
    graph.balloonText = "[[category]]: [[value]]";
    graph.type = "column";
    graph.lineAlpha = 0;
    graph.fillAlphas = 1;
    chart.addGraph(graph);

    // WRITE
    chart.write("chartdiv");
});
    </script>
    </body>
    </html>
4

1 回答 1

1

在视图页面上之后，您可以在控制器上的数组中收集所有值，您可以这样调用它：-

<!DOCTYPE html>
    <html>
    <head>
      <script src="http://www.amcharts.com/lib/amcharts.js" type="text/javascript"></script>

    </head>
    <body>
  <div id="chartdiv" style="width: 100%; height: 355px;"></div>
 <script type="text/javascript" language="javascript">
var chart;

var chartData = [{
    year: "<?php echo $date1;?>",
    visits: "<?php echo $date1visitval;?>"
    },
{
    year: "<?php echo $date2;?>",
    visits: "<?php echo $date2visitval;?>"
    },
{
    year:  "<?php echo $date4;?>",
    visits: "<?php echo $date3visitval;?>"
    },
{
    year:  "<?php echo $date4;?>",
    visits: "<?php echo $date4visitval;?>"
    }
    }];


AmCharts.ready(function() {
    // SERIAL CHART
    chart = new AmCharts.AmSerialChart();
    chart.autoMarginOffset = 0;
    chart.dataProvider = chartData;
    chart.categoryField = "year";
    chart.startDuration = 1;
    chart.depth3D = 20;
    chart.angle = 30;

    // AXES
    // category
    var categoryAxis = chart.categoryAxis;
    categoryAxis.labelRotation = 45; // this line makes category values to be rotated
    categoryAxis.gridAlpha = 0;
    categoryAxis.fillAlpha = 1;
    categoryAxis.fillColor = "#FAFAFA";
    categoryAxis.gridPosition = "start";

    // value
    var valueAxis = new AmCharts.ValueAxis();
    valueAxis.dashLength = 5;
    valueAxis.title = "Visitors from country";
    valueAxis.axisAlpha = 0;
    chart.addValueAxis(valueAxis);

    // GRAPH
    var graph = new AmCharts.AmGraph();
    graph.valueField = "visits";
    graph.colorField = "color";
    graph.balloonText = "[[category]]: [[value]]";
    graph.type = "column";
    graph.lineAlpha = 0;
    graph.fillAlphas = 1;
    chart.addGraph(graph);

    // WRITE
    chart.write("chartdiv");
});
    </script>
    </body>
    </html>
于 2013-08-08T05:08:28.167 回答