"Uncaught ReferenceError: map is not defined" on swing app using jxbrowser

Question

This is the code for showing map on swing application with jxbrowser. But when i click on the button, "Uncaught ReferenceError: map is not defined" this error is shown. The application is showing the map. But the joom in out and marker button does not working. What should i do?

    final Browser browser = new Browser();
    BrowserView view = new BrowserView(browser);

    JButton zoomInButton = new JButton("Zoom In");
    zoomInButton.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent e) {
            if (zoomValue < MAX_ZOOM) {
                browser.executeJavaScript("map.setZoom(" + ++zoomValue + ")");
            }
        }
    });

    JButton zoomOutButton = new JButton("Zoom Out");
    zoomOutButton.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent e) {
            if (zoomValue > MIN_ZOOM) {
                browser.executeJavaScript("map.setZoom(" + --zoomValue + ")");
            }
        }
    });

    JButton setMarkerButton = new JButton("Set Marker");
    setMarkerButton.addActionListener(new ActionListener() {
        public void actionPerformed(ActionEvent e) {
            browser.executeJavaScript("var myLatlng = new google.maps.LatLng(48.4431727,23.0488126);\n" +
                    "var marker = new google.maps.Marker({\n" +
                    "    position: myLatlng,\n" +
                    "    map: map,\n" +
                    "    title: 'Hello World!'\n" +
                    "});");
        }
    });

    JPanel toolBar = new JPanel();
    toolBar.add(zoomInButton);
    toolBar.add(zoomOutButton);
    toolBar.add(setMarkerButton);

    JFrame frame = new JFrame();
    frame.setDefaultCloseOperation(WindowConstants.EXIT_ON_CLOSE);

    frame.add(view, BorderLayout.CENTER);

    frame.add(toolBar, BorderLayout.SOUTH);
    frame.setSize(900, 500);
    frame.setLocationRelativeTo(null);
    frame.setVisible(true);

    // Provide the correct full path to the map.html file, e.g. D:\\map.html
    browser.loadURL("file:///E:/Programming/map.html");

and my map.html file:

<!DOCTYPE html>
<html>
<head>
<script src="http://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
  var mapProp = {
    center:new google.maps.LatLng(51.508742,-0.120850),
    zoom:5,
    mapTypeId:google.maps.MapTypeId.ROADMAP
  };
  var map=new google.maps.Map(document.getElementById("googleMap"),mapProp);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>

<body>
<div id="googleMap" style="width:850px;height:380px;"></div>
</body>

</html>

I declared the map variable before initialize method. It works.thnx swagbomb — , Mar 13 '16 at 05:42

score 1 · Answer 1 · answered Mar 14 '16 at 09:57

I suppose it happens because you didn't provide API_KEY for Google Maps API as described in the instruction at https://jxbrowser.support.teamdev.com/support/solutions/articles/9000012874-google-maps

Please replace the API_KEY string with your Google API KEY value:

https://maps.googleapis.com/maps/api/js?key=API_KEY&sensor=false

score 0 · Answer 2 · edited May 23 '17 at 12:10

0

You cannot load the API once the page has already loaded.

google.maps.event.addDomListener(window, 'load', initialize);

You can check out some similar SO or this to get more guidance.

edited May 23 '17 at 12:10

Community

1
1

answered Mar 11 '16 at 14:18

SwagBomb

584
3
7

"Uncaught ReferenceError: map is not defined" on swing app using jxbrowser

2 Answers2