2017-09-26 130 views
1

我想在图形点击事件上获取Label,我正在使用amchart堆叠酒吧。如何在clickgraphitem上获取amchart堆叠酒吧的标签

  • 实施例:
    • 当我点击栏1 图1类别的1:8,我得到图1
    • 当我点击栏1 图2类别1:5,我得到图2

以下是图表的链接,我也加了我的代码:Stackbar chart

chart.addListener("clickGraphItem", DashBoardClick); 
    function DashBoardClick(event) { 
    alert(event.item.category); 
} 

回答

1

假设你的意思是图形的标题,你可以在事件参数通过对象访问它作为documentation注意,然后访问图形的title性质,即event.graph.title

var chart = AmCharts.makeChart("chartdiv", 
 
    { 
 
     "type": "serial", 
 
     "categoryField": "category", 
 
     "startDuration": 1, 
 
     "categoryAxis": { 
 
     "gridPosition": "start" 
 
     }, 
 
     "trendLines": [], 
 
     "graphs": [ 
 
     { 
 
      "balloonText": "[[title]] of [[category]]:[[value]]", 
 
      "fillAlphas": 1, 
 
      "id": "AmGraph-1", 
 
      "title": "graph 1", 
 
      "type": "column", 
 
      "valueField": "column-1" 
 
     }, 
 
     { 
 
      "balloonText": "[[title]] of [[category]]:[[value]]", 
 
      "fillAlphas": 1, 
 
      "id": "AmGraph-2", 
 
      "title": "graph 2", 
 
      "type": "column", 
 
      "valueField": "column-2" 
 
     } 
 
     ], 
 
     "guides": [], 
 
     "valueAxes": [ 
 
     { 
 
      "id": "ValueAxis-1", 
 
      "stackType": "regular", 
 
      "title": "Axis title" 
 
     } 
 
     ], 
 
     "allLabels": [], 
 
     "balloon": {}, 
 
     "legend": { 
 
     "enabled": true, 
 
     "useGraphSettings": true 
 
     }, 
 
     "titles": [ 
 
     { 
 
      "id": "Title-1", 
 
      "size": 15, 
 
      "text": "Chart Title" 
 
     } 
 
     ], 
 
     "dataProvider": [ 
 
     { 
 
      "category": "category 1", 
 
      "column-1": 8, 
 
      "column-2": 5 
 
     }, 
 
     { 
 
      "category": "category 2", 
 
      "column-1": 6, 
 
      "column-2": 7 
 
     }, 
 
     { 
 
      "category": "category 3", 
 
      "column-1": 2, 
 
      "column-2": 3 
 
     } 
 
     ] 
 
    } 
 
); 
 

 
chart.addListener('clickGraphItem', function(event) { 
 
    alert(event.graph.title); 
 
})
<script src="//www.amcharts.com/lib/3/amcharts.js"></script> 
 
<script src="//www.amcharts.com/lib/3/serial.js"></script> 
 
<script src="//www.amcharts.com/lib/3/themes/light.js"></script> 
 

 
<div id="chartdiv" style="width: 100%; height: 350px;"></div>