Question

以下是代码am has.in此代码静态给出值。现在我需要做的是我需要获取动态值并且必须显示图表。在项目变量中我必须以相同的方式从控制器获取值并且必须显示图表。谢谢。

 <!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>

Answer 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>

如何在代码点火器中从控制器给图表赋予动态值

1 个答案: