1

I am working on an amCharts amMap for the USA. I need to implement markers on the map. I am following this example, but it is not working as expected. The markers are not showing properly.

CODE

var map = AmCharts.makeChart("chartdiv", {
            type: "map",
            "theme": "light",
            imagesSettings: {
                rollOverColor: "#089282",
                rollOverScale: 3,
                selectedScale: 3,
                selectedColor: "#089282",
                color: "#13564e"
            },
            colorSteps: 10,

            dataProvider: {
                map: "usaLow",
                images: [{
                    zoomLevel: 5,
                    scale: 0.5,
                    title: "Dallas",
                    latitude: 32.82092,
                    longitude: -97.0115
                }, {
                    zoomLevel: 5,
                    scale: 0.5,
                    title: "Florida",
                    latitude: 25.7824,
                    longitude: -80.3011
                }]
            },

            areasSettings: {
                autoZoom: false,
               unlistedAreasColor: "#81c5e8"
            },

        });

JSFIDDLE

mg1075
  • 17,985
  • 8
  • 59
  • 100
ANJYR
  • 2,583
  • 6
  • 39
  • 60

1 Answers1

0

I sympathize with the problem you are having and it is understandably confusing. Short answer: you need to use one of the amMap USA maps that allows for latitude and longitude specifications.

Please review the answer to a similar question here:

To quote from that answer:

It seems like you are using a non-calibrated US map. ...This map is distorted for visual purposes and thus not compatible with real latitude/longitude coordinates.

To work around that, you will need to use one of the maps that are calibrated.

Here is an updated version of your example using a different USA map which does allow for specifying latitude and longitude.

Community
  • 1
  • 1
mg1075
  • 17,985
  • 8
  • 59
  • 100