如何使用带有 derby 数据库的 jsf 在 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>
最佳答案
您应该下载 gmaps4jsf jar 文件并使用它。 GMaps4JSF 将 Google map 与 JSF 集成。您可以创建 java bean 类并通过 JSF 动态调用该值。可以引用这个http://www.mashups4jsf.com/gmaps4jsf-examples2-3.0.0/pages/welcome.xhtml它会帮助你。 或者这里我举一个例子。
JSF代码:
<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类:(java bean类)
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;
}
关于javascript - 如何使用带有 Derby 数据库的jsf在谷歌地图上动态创建多边形?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32761640/