2017-09-26 308 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>