【问题标题】:amcharts - how to set lat/lon in mappolygon?amcharts - 如何在 mappolygon 中设置纬度/经度?
【发布时间】:2019-07-09 18:31:40
【问题描述】:

基本上,我只想在用户定义的纬度/经度处绘制一个圆,半径为 X 公里。

所以我意识到查看文档,我无法更改已经通过地理数据加载的 mappolygons 的纬度/经度,但我想我不太确定如何创建具有指定纬度的新地图多边形/lon 或者我什至可以这样做!

我的代码设置为每次用户单击某处时都会相应地绘制或重新绘制标记,标记的位置就是我想要绘制圆心的位置。我使用 getCircle 函数得到了这个,我需要为第三个变量做整个 km2deg,但我现在更关心位置。任何帮助都会很棒!

https://codepen.io/kbreezy/pen/wLRrPq

下面是我的onclick方法的代码。

chart.seriesContainer.events.on("hit", function(ev) {
  var lp = $("#chartdiv").data("point");
  var coords = chart.svgPointToGeo(ev.svgPoint);

  if (lp) {
      lp.latitude = coords.latitude;
      lp.longitude = coords.longitude;
  } else {
    var marker = imageSeries.mapImages.create();
    marker.latitude = coords.latitude;
    marker.longitude = coords.longitude;
  }
  $("#chartdiv").data("point", marker);


  var circleSeries = chart.series.push(new am4maps.MapPolygonSeries())
    var circleTemplate = circleSeries.mapPolygons.template;
    circleTemplate.fill = am4core.color("#bf7569");
    circleTemplate.strokeOpacity = 1;
    circleTemplate.fillOpacity = 0.75;


  var polygon = circleSeries.mapPolygons.create();
  var mapPolygon = polygonSeries.getPolygonById("DE");
  mapPolygon.setPropertyValue('latitude', coords.latitude);
  mapPolygon.setPropertyValue('longitude', coords.longitude);
  polygon.latitude = coords.latitude;
  polygon.longitude = coords.longitude;
  polygon.multiPolygon = am4maps.getCircle(mapPolygon.visualLongitude, mapPolygon.visualLatitude, 5);


//polygon.multiPolygon = am4maps.getCircle(coords.latitude, coords.longitude, 5);

});

【问题讨论】:

    标签: javascript maps amcharts


    【解决方案1】:

    MapPolygon 没有一些可以“移动”它的纬度/经度。它的多面体必须包含您要显示的区域的坐标。因此,当您将经度/纬度传递给 getCircle 方法时,它会在该点周围返回 multiPolygon。

    我修改了你的笔在哪里显示概念:https://codepen.io/team/amcharts/pen/ydrLZw

    polygon.multiPolygon = am4maps.getCircle(coords.longitude, coords.latitude, 5);
    

    【讨论】:

    • 非常感谢你是个宝贝。老实说,这很简单,因为我发誓我试过了,但是哦,哈哈,谢谢你们。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-09-09
    • 1970-01-01
    • 2014-04-25
    • 1970-01-01
    • 2015-09-20
    相关资源
    最近更新 更多