0

我正在尝试向 amCharts 的 stockChart 添加一个侦听器,但找不到在哪里。

根据chartCursor 的文档,您可以设置changed事件,chartCursorchartCursor在 stockChart 上不存在,只有根据StockChart 文档的常规图表。据我所知,唯一的半相关设置是chartCursorSettings但它不允许设置任何侦听器。

如何通过 amCharts 的 amStockChart 捕捉鼠标移动/更改事件?

4

1 回答 1

2

changed可以在面板级别捕获事件:

var chart = AmCharts.makeChart("chartdiv", {
  // ...
  "panels": [{
    // ...
    "listeners": [{
      "event": "changed",
      "method": function(e) {
        console.log('changed event fired')
      }
    }],
  }],
  // ...
});

演示如下:

var chart = AmCharts.makeChart("chartdiv", {
  "type": "stock",
  "theme": "light",

  "categoryAxesSettings": {
    "minPeriod": "mm"
  },

  "dataSets": [{
    "fieldMappings": [{
      "fromField": "value",
      "toField": "value"
    }],

    "dataProvider": generateChartData(),
    "categoryField": "date"
  }],

  "panels": [{
    "stockGraphs": [{
      "valueField": "value",
      "type": "smoothedLine"
    }],
    "listeners": [{
      "event": "changed",
      "method": function(e) {
        console.log('changed event fired')
      }
    }],
  }],

  "chartCursorSettings": {
    "valueBalloonsEnabled": true
  }
});


function generateChartData() {
  var chartData = [];
  var firstDate = new Date( 2012, 0, 1 );
  firstDate.setDate( firstDate.getDate() - 1000 );
  firstDate.setHours( 0, 0, 0, 0 );

  for ( var i = 0; i < 1000; i++ ) {
    var newDate = new Date( firstDate );
    newDate.setHours( 0, i, 0, 0 );

    var a = Math.round( Math.random() * ( 40 + i ) ) + 100 + i;

    chartData.push( {
      date: newDate,
      value: a
    } );
  }
  return chartData;
}
 #chartdiv {
	width: 100%;
	height: 300px;
}
<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>
<script src="//www.amcharts.com/lib/3/amstock.js"></script>
<div id="chartdiv"></div>

于 2017-03-01T12:07:35.807 回答