amcharts 的 stockChart 鼠标移动监听器答案

【问题标题】：amcharts' stockChart mouse move listeneramcharts 的 stockChart 鼠标移动监听器
【发布时间】：2017-03-01 11:31:35
【问题描述】：

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

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

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

【问题讨论】：

标签： javascript amcharts amstock

【解决方案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>

【讨论】：

祝福你！
顺便说一句，我看到你为 amCharts 工作 - 请让他们知道，从他们的文档中很难理解这一点
当然。我会传下去的。