Question

我需要这样的东西javascript amCharts graph item click event 我正在使用AmCharts.makeChart，似乎无法整合之前的答案。有人可以通过这种制作amcharts的方法帮助使点击处理程序正常工作吗？任何帮助将不胜感激。

Code I目前正在使用：

AmCharts.makeChart("0",
{
    "type": "serial",
    "pathToImages": "http://cdn.amcharts.com/lib/3/images/",
"categoryField": "Not set",
"rotate": true,
"colors": [
"#45C40E",
"#E82323"
],
"startDuration": 1,
"startEffect": "easeOutSine",
"handDrawScatter": 4,
"handDrawThickness": 11,
"categoryAxis": {
"gridPosition": "start",
"position": "left",
"axisThickness": 0,
"labelFrequency": 0,
"showFirstLabel": false,
"showLastLabel": false,
"tickLength": 0
},
"trendLines": [],
"graphs": [
{
    "balloonText": "[[title]]:[[value]]",
    "bulletField": "Not set",
    "fillAlphas": 1,
    "id": "AmGraph-1",
    "title": "Yes",
    "type": "column",
    "valueField": "column-1",
    "visibleInLegend": false
},
{
    "balloonText": "[[title]]:[[value]]",
    "fillAlphas": 1,
    "id": "AmGraph-2",
    "title": "No",
    "type": "column",
    "valueField": "column-2",
    "visibleInLegend": false
}
],
    "guides": [],
    "valueAxes": [
{
    "id": "ValueAxis-1",
    "stackType": "100%",
    "axisThickness": 0,
    "gridThickness": 0,
    "labelFrequency": 0,
    "labelsEnabled": false,
    "showFirstLabel": false,
    "showLastLabel": false,
    "tickLength": 0,
    "title": ""
}
],
    "allLabels": [],
    "balloon": {},
    "legend": {
    "useGraphSettings": true
},
    "titles": [
{
    "id": "Title-1",
    "size": 22,
    "text": ""

}
],
    "dataProvider": [
{
    "category": "category 1",
    "column-1": "53",
    "column-2": "13"
}
]
    }
);

Answer 1

您必须将图表存储在变量中，然后为clickGraphItem事件添加侦听器：


var chart = AmCharts.makeChart("0", {
      "type": "serial",
      "pathToImages": "http://cdn.amcharts.com/lib/3/images/",
      "categoryField": "Not set",
      "rotate": true,
      "colors": [
          "#45C40E",
          "#E82323"
      ],
      "startDuration": 1,
      "startEffect": "easeOutSine",
      "handDrawScatter": 4,
      "handDrawThickness": 11,
      "categoryAxis": {
          "gridPosition": "start",
          "position": "left",
          "axisThickness": 0,
          "labelFrequency": 0,
          "showFirstLabel": false,
          "showLastLabel": false,
          "tickLength": 0
      },
      "trendLines": [],
      "graphs": [{
          "balloonText": "[[title]]:[[value]]",
          "bulletField": "Not set",
          "fillAlphas": 1,
          "id": "AmGraph-1",
          "title": "Yes",
          "type": "column",
          "valueField": "column-1",
          "visibleInLegend": false
      }, {
          "balloonText": "[[title]]:[[value]]",
          "fillAlphas": 1,
          "id": "AmGraph-2",
          "title": "No",
          "type": "column",
          "valueField": "column-2",
          "visibleInLegend": false
      }],
      "guides": [],
      "valueAxes": [{
          "id": "ValueAxis-1",
          "stackType": "100%",
          "axisThickness": 0,
          "gridThickness": 0,
          "labelFrequency": 0,
          "labelsEnabled": false,
          "showFirstLabel": false,
          "showLastLabel": false,
          "tickLength": 0,
          "title": ""
      }],
      "allLabels": [],
      "balloon": {},
      "legend": {
          "useGraphSettings": true
      },
      "titles": [{
          "id": "Title-1",
          "size": 22,
          "text": ""

      }],
      "dataProvider": [{
          "category": "category 1",
          "column-1": "53",
          "column-2": "13"
      }]
  });


chart.addListener("clickGraphItem", handleClick)

function handleClick(event){
    console.log(event);
}

Javascript amcharts堆积条形图单击处理程序

1 个答案: