Question

我需要创建一个动态的多层次，因为我必须深入到数百甚至数千个将从数据库加载的数据提供程序。流程是这样的：我有1年，2年，3年，4年和5年，每年将深入到16个部门，并将深入到10个或更多课程。手动完成它是乏味的，我需要它是动态的。请帮我。

变量：

ArgumentException

图表：

var ccs_final_data = AmCharts.loadJSON("<?php echo base_url();?>index.php/osa/final_ccs_data");

//VAR CCS AVERAGE_FINAL
var drill_down_to_ccs_courses_average_final = AmCharts.loadJSON("<?php echo base_url();?>index.php/osa/ccs_courses_data_average_final");
var drill_down_to_ccs_sections_BSIT_average_final = AmCharts.loadJSON("<?php echo base_url();?>index.php/osa/ccs_sections_data_BSIT_average_final");
var drill_down_to_ccs_sections_ACT_average_final = AmCharts.loadJSON("<?php echo base_url();?>index.php/osa/ccs_sections_data_ACT_average_final");
var drill_down_to_ccs_sections_BSCS_average_final = AmCharts.loadJSON("<?php echo base_url();?>index.php/osa/ccs_sections_data_BSCS_average_final");

这里是深入研究的东西：

    var chart2 = AmCharts.makeChart( "ccs2", {
  "theme": "light",
  type: "serial",
  pathToImages: "http://cdn.amcharts.com/lib/3/images/",
  dataProvider: ccs_final_data,
  categoryField: "category",

  categoryAxis: {
    labelRotation: 0,
    gridPosition: "start"
  },

  valueAxes: [ {
    title: "CCS FINAL TERM - Passing"
  } ],

  graphs: [ {

    valueField: "value",
    colorField: "color",
    type: "column",
    lineAlpha: 100,
    fillAlphas: 1
  } ],

  chartScrollbar: {
    "updateOnReleaseOnly": true
  },

  chartCursor: {
    bulletsEnabled: "enabled",
    bulletSize: 15,
    cursorAlpha: 100,
    cursorColor: "#CC0000",
    zoomable: true,
    categoryBalloonEnabled: true
  },
  export: {
    enabled: true
  }
} );

Answer 1

我说使其动态化的最佳方法是为数据中的每个数据点包含一些自定义字段，这些字段将传递到服务器端脚本，以便它知道要加载哪些数据。

我假设您的数据现在看起来像这样：

[ {
  "category": "BSIT",
  "value": 100
}, {
  "category": "ACT",
  "value": 200
}, {
  "category": "BSCS",
  "value": 150
} ]

您可以轻松添加第三个字段来保存深入挖掘数据的信息：

[ {
  "category": "BSIT",
  "value": 100,
  "drill": "ccs_sections_data_BSIT_average_final"
}, {
  "category": "ACT",
  "value": 200,
  "drill": "ccs_sections_data_ACT_average_final"
}, {
  "category": "BSCS",
  "value": 150,
  "drill": "ccs_sections_data_BSCS_average_final"
} ]

然后，当clickGraphItem事件发生时，您可以获取该信息并将其传递给动态加载脚本：

chart2.addListener( "clickGraphItem", function( event ) {
  if ( event.item.dataContext.drill !== undefined ) {
    event.chart.dataProvider = AmCharts.loadJSON( "<?php echo base_url();?>index.php/osa/" + event.item.dataContext.drill );
    event.chart.validateData();
  }
} );

这样，您可以拥有任意数量的向下钻取级别，每个级别数据都包含有关在何处查找下一级别数据的信息。

此外，我不确定您是否发布了代码，因此我假设AmCharts.loadJSON方法是同步的。如果不是（例如，如果您使用Data Loader中的方法），则需要在加载数据后分配图表dataProvider。

在Amcharts中动态创建多级钻取

1 个答案: