javascript - amcharts 的 stockChart 鼠标移动监听器

Question

我正在尝试向 amCharts 的 stockChart 添加监听器，但找不到位置。

根据the docs of chartCursor您可以在chartCursor上设置changed事件，但是stockChart上不存在chartCursor，仅根据the docs of the StockChart的常规图表存在。据我所知，唯一半相关的设置是 chartCursorSettings但它不允许设置任何监听器。

如何捕获 amCharts 的 amStockChart 上的鼠标移动/更改事件？

Answer 1

changed 事件可以在 panel 处捕获。级别:

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>