•  25-06-2022
  •  | 
  •  

문제

I want to add a circular marker to an ammap map. The marker should be centered on Berlin, which has latitude 52.523407 and longitude 13.4114 (you can verify these coordinates here).

Here's the source code of a page that attempts this. A jsFiddle example is also avaialble.

<html>
<head>

<script src="ammap.js" type="text/javascript"></script>
<script src="germanyLow.js" type="text/javascript"></script>

<script type="text/javascript">

    var dataPoints = [{
            latitude: 52.523407,
            longitude: 13.4114,
            type: 'bubble',
            color: '#CC0000',    
            fixedSize: false,
            alpha: 0.5,
            height: 50,
            width: 50
    }];

    AmCharts.ready(function() {
        // create AmMap object
        var map = new AmCharts.AmMap();

        // set path to images
        map.pathToImages = "images/map";

        var dataProvider = {
            mapVar: AmCharts.maps.germanyLow,
            getAreasFromMap:true,
            images: dataPoints
        }; 

        // pass data provider to the map object
        map.dataProvider = dataProvider;

        map.areasSettings = {
            autoZoom: true,
            selectedColor: "#CC0000"
        };

        // write the map to container div
        map.write("mapdiv");                           
    });

</script>
</head>
<body>    
    <div id="mapdiv" style="width: 600px; height: 400px;"></div>
</body>
</html>

If you open this page you see the following. I've added the black arrow myself to indicate where the circle should be located. As you can see the centre of the circle is about 150km north-west of it should be. If I add other markers they are also positioned about 150 km NW of where I would expect them to be. Am I doing something wrong, or is this a bug?

enter image description here

도움이 되었습니까?

해결책

You should add "centered: false" attribute to your MapImage:

var dataPoints = [{
        latitude: 52.523407,
        longitude: 13.4114,
        type: 'bubble',
        color: '#CC0000',

        fixedSize: false,
        alpha: 0.5,
        height: 50,
        width: 50,
        centered: false
}];

Here's your updated fiddle:

http://jsfiddle.net/amcharts/6c5U3/591/

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top