How to draw polyline in struts2 using google map3

Question

I want this functionality to my project.

I am trying to provide the functionality, Onbutton click, I fetch the coordinates data from MySQL into an array and then put this array to the value of the text box, so that JavaScript read this value. But when I put the var coordinates value to polyline it shows blank and when I copy the same value from the textbox and pase it to the same var its working.

Java code:

try {
Connection.getConnection();
java.sql.PreparedStatement preparedStatement = Connection.con
                .prepareStatement("select * from co_ordinates_data");

        resultSet = preparedStatement.executeQuery();

        while (resultSet.next()) {

            latitude.add(resultSet.getDouble("latitude"));
            longitude.add(resultSet.getDouble("longitude"));

            latlong.add("new google.maps.LatLng("
                    + resultSet.getDouble("latitude") + ","
                    + resultSet.getDouble("longitude") + ")");

        }

        size = latitude.size();

    } catch (Exception e) {
        System.out.println("path exception " + e.toString());
    }
    return "execute";

//textbox
<input type="text" id="latlng" value="<s:property value="latlong"/>"

here is my js code:

function initialize() {
    var myLatLng = new google.maps.LatLng(28.493729, 77.09255);
    var mapOptions = {
        zoom : 8,
        center : myLatLng,
        mapTypeId : google.maps.MapTypeId.ROADMAP
    };

    var map = new google.maps.Map(document.getElementById("map-canvas"),
            mapOptions);

    var cordinates = document.getElementById("latlng").value;


    var flightPlanCoordinates = [cordinates ];

    var flightPath = new google.maps.Polyline({
        path : flightPlanCoordinates,
        strokeColor : "#FF0000",
        strokeOpacity : 1.0,
        strokeWeight : 2
    });

    flightPath.setMap(map);
}

Answer 1

Probably the problem is that, when you run your initialize() Javascript function, the page is not fully loaded, and the <input /> element containing your coordinates is not yet rendered;

Try calling initialize() from a javascript console (in Firefox, CTRL + SHIFT + K ), to see if it works.

You need to enclose the call to your javascript in a jQuery $(document).ready() function ( more info here ), or to move your javascript function out of the <head> part, placing it at the end of the <body> part (not recommended).

Example:

function initialize(){
   // all your stuff as above...
   // all your stuff as above...
   // all your stuff as above...
}

$(document).ready(function() {
    initialize();
});

How to draw polyline in struts2 using google map3

Question

1 answers

solution1
0 2013-04-22 12:21:29

How to draw polyline in struts2 using google map3

Question

1 answers

solution1 0 2013-04-22 12:21:29

solution1
0 2013-04-22 12:21:29