Menu
How to create a polygon dynamically on google map using jsf with derby database?This code worked for static points but i have dynamic data in points entity. How to get those points and display in google map?
<html>
<head>
<style>
#map {
width: 1200px;
height: 1000px;
}
</style>
<script src="https://maps.googleapis.com/maps/api/js"></script>
<script>
function initialize() {
var map = new google.maps.Map(document.getElementById('map'), {
zoom: 5,
center: {lat: 17.68, lng: 83.21},
mapTypeId: google.maps.MapTypeId.TERRAIN
});
// Define the LatLng coordinates for the polygon's path.
var triangleCoords = [
{lat: 18.3000, lng: 83.900},
{lat: 18.1713, lng: 82.1278},
{lat: 17.370, lng: 78.480},
{lat: 17.68, lng: 83.21},
];
// Construct the polygon.
var bermudaTriangle = new google.maps.Polygon({
paths: triangleCoords,
strokeColor: '#FF0000',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#FF0000',
fillOpacity: 0.35
});
bermudaTriangle.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
you should download gmaps4jsf jar file and use it. GMaps4JSF integrating Google maps with JSF. you can create java beans class and call the value dynamically through JSF. You can refer this http://www.mashups4jsf.com/gmaps4jsf-examples2-3.0.0/pages/welcome.xhtml it will help you. or Here I am giving one example.
JSF code:
<m:map id="map" width="1080px" height="350px" partiallyTriggered="true" latitude="#{pointBean.mapLatitude}" longitude="#{pointBean.mapLongitude}" enableScrollWheelZoom="true">
<m:polygon id="polygon" lineWidth="2" hexStrokeColor="red" hexFillColor="lightpink">
<ui:repeat var="point" value="#{pointBean.points}" varStatus="status" offset="0" step="1" size="#{pointBean.points.size()}">
<m:point latitude="#{point.latitude.toString()}" longitude="#{point.longitude.toString()}">
</m:point>
</ui:repeat>
</m:polygon>
</m:map>
pointBean class:(java bean class)
private List<Point> points;
private Float mapLatitude;
private Float mapLongitude;//create getter or setter also
public List<Point> getlatlong() {
String query = ".....";//write here your query
points = new ArrayList<Point>();
Point point = null;
ResultSet rs = null;
try {
connection = ConnectionFactory.getConnection();//here is connection for jdbc connectivity
statement = connection.createStatement();
rs = statement.executeQuery(query);
while (rs.next()) {
point = new Point();
point.setLatitude(rs.getFloat("latitude"));
point.setLongitude(rs.getFloat("longitude"));
points.add(point);
}
mapLatitude = points.get(0).getLatitude();
mapLongitude = points.get(0).getLongitude();
}
catch(Exception e)
{
e.printStackTrace();
}
finally
{
DBUtil.close(rs);
DBUtil.close(statement);
DBUtil.close(connection);
}
return points;
}
public List<Point> getPoints() {
return points;
}
59
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
