Map will not display on screen, svg tag is inserted

StackOverflow https://stackoverflow.com/questions/23566349

  •  19-07-2023
  •  | 
  •  

Вопрос

I have taken the tutorial from the ammaps site, and placed it in a html page. When map.write is called and SVG tag is inserted where it is supposed to be, however I never see anything in the browser. I have checked and the JS files are loading and in the correct order. I am not getting any errors in the console either. Below you will find the code I am using:

<html>
<head>
    <style>
        #chartdiv {
            width   : 100%;
            height  : 500px;
        }               
    </style>
</head>
<body>
    <div id = "mapdiv" style="width: 600px; height: 400px;">
    </div>

    <script src="../libs/jquery-1.10.2.min.js"></script>
    <script src="../libs/ammaps/ammap.js"></script>
    <script src="../libs/ammaps/maps/js/worldLow.js"></script>
    <script>
        AmCharts.ready(function() {
            console.log("AmCharts.ready");

            var map = new AmCharts.AmMap();
            map.pathToImages = "ammap/images/";
            var dataProvider = {
                //map: "worldLow",
                        mapVar: "worldLow",
                getAreasFromMap:true              
            }; 
            map.dataProvider = dataProvider;
            map.areasSettings = {
                autoZoom: true,
                selectedColor: "#CC0000"
            };
            map.smallMap = new AmCharts.SmallMap();
            map.write("mapdiv");
        });
    </script>
</body>
</html>

UPDATE: I discovered by changing the map property of the dataProvider object from map to mapVar results in me seing the map navigation controls, still no map though

Это было полезно?

Решение

To get the map to display I had to change the value of the mapVar property from "worldLow" to AmCharts.maps.worldLow.

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top