繁体   English   中英

在 AmCharts 的自定义标记点击上触发 Javascript 功能

[英]Fire Javascript function on custom marker click for AmCharts

我正在尝试使用具有自定义 HTML 标记的 AmChart 世界地图(就像这个例子: https ://www.amcharts.com/demos/custom-html-elements-map-markers/)

我的代码在下面,我根据 AmChart 网站上的另一个示例添加了我希望成为有效点击侦听器的内容。

var map;
map = AmCharts.makeChart( "chartdiv", {
  "type": "map",
  "theme": "black",
  "projection": "miller",

  "imagesSettings": {
    "rollOverColor": "#42adca",
    "rollOverScale": 3,
    "selectedScale": 3,
    "selectedColor": "#42adca",
    "color": "#42adca"
  },

  "areasSettings": {
    "unlistedAreasColor": "#42adca"
  },

  "dataProvider": {
    "map": "worldLow",
    "images": [ {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "San Jose, CA",
      "latitude": 37.3382,
      "longitude": -121.8863,
       "click": 'test()'
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Dulles, VA",
      "latitude": 38.9559,
      "longitude": -77.4478
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "London, UK",
      "latitude": 51.5074,
      "longitude": 0.1278
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Denver, CO",
      "latitude": 39.7392,
      "longitude": -104.9903
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Miami, FL",
      "latitude": 25.7617,
      "longitude": -80.1918
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Los Angeles, CA",
      "latitude": 34.0522,
      "longitude": -118.2437
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "New York, NY",
      "latitude": 40.7128,
      "longitude": -74.0059
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Chicago, IL",
      "latitude": 41.8781,
      "longitude": -87.6298
    } ]
  },
  "listeners": [{
    "event": "clickMapObject",
    "method": function(event) {
        console.log(event.mapObject.title);
    }
  }]
} );

但是,console.log 不会触发。 单击地图不会执行任何操作。 我可以设置 URL,但我想指定一个 JS 函数。

任何指针都会很棒。

发布后不久,我找到了答案。

'url' 参数的作用类似于常规的 href,因此,这是有效的:

"dataProvider": {
    "map": "worldLow",
    "images": [ {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "San Jose, CA",
      "latitude": 37.3382,
      "longitude": -121.8863,
       "url": 'javascript:test()'
    }, {
      "zoomLevel": 5,
      "scale": 0.5,
      "title": "Dulles, VA",
      "latitude": 38.9559,
      "longitude": -77.4478
    }, {

注意"url": 'javascript:test()'

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM