[使用amCharts执行事件侦听器clickGraphItem时如何引用JavaScript对象数组中的变量

问题描述 投票:0回答:1

我目前有一个名为chartData的JavaScript对象数组,其中有country和visits作为变量。我利用amCharts在柱形图中绘制数据图形,并使用事件处理程序来触发有关国家(event.item.category)和访问(event.item.values.value)的警报消息,具体取决于列单击该按钮,一切正常(请参见下面的handleClick函数)。按照下面的代码,我向chartData JavaScript对象添加了一个名为id的附加变量。如何在handleClick事件函数中访问新的变量ID。

amCharts JavaScript代码

<script src="http://www.amcharts.com/lib/amcharts.js" type="text/javascript"></script>
<div id="chartdiv" style="width: 100%; height: 440px; background-color:#eeeeee;"></div>

var chart;

var chartData = 
[{
    country: "USA",
    visits: 4025,
    id: 1},
{
    country: "China",
    visits: 1882,
    id: 2},
{
    country: "Japan",
    visits: 1809,
    id: 3},
{
    country: "Germany",
    visits: 1322,
    id: 4},
{
    country: "UK",
    visits: 1122,
    id: 5}];


function handleClick(event)
{
    alert(event.item.category + ": " + event.item.values.value);
}


AmCharts.ready(function() {
    // SERIAL CHART
    chart = new AmCharts.AmSerialChart();
    chart.dataProvider = chartData;
    chart.categoryField = "country";
    chart.startDuration = 1;


    // add click listener
    chart.addListener("clickGraphItem", handleClick);


    var categoryAxis = chart.categoryAxis;
    categoryAxis.labelRotation = 90;
    categoryAxis.gridPosition = "start";


    var graph = new AmCharts.AmGraph();
    graph.valueField = "visits";
    graph.balloonText = "[[category]]: [[value]]";
    graph.type = "column";
    graph.lineAlpha = 0;
    graph.fillAlphas = 0.8;
    chart.addGraph(graph);

    chart.write("chartdiv");
});

JsFiddlehttp://jsfiddle.net/amcharts2/cV8GG/

javascript amcharts amcharts4
1个回答
0
投票

您可以在event.item.dataContext.id中看到ID

function handleClick(event)
{
    console.log(event.item.dataContext.id);
    alert(event.item.category + ": " + event.item.values.value);
}
© www.soinside.com 2019 - 2024. All rights reserved.