CartoDb+谷歌地图多边形
CartoDb + Google Maps Polygon
我使用cartodb(谷歌地图)绘制多段线,然后在谷歌地图中插入一个多边形。
问题是,两个映射加载在一起。一个带有cartodb多段线,另一个带有多边形。我需要他们在同一张地图上。不确定我做错了什么。
function main() {
var map;
var sql; // sql query object for querying CartoDB SQL API
var sublayers = [];
// create google maps map
var mapOptions = {
zoom: 12,
center: new google.maps.LatLng(26.178347,50.6116694),
mapTypeId: google.maps.MapTypeId.HYBRID,
panControl: true,
panControlOptions: {
position: google.maps.ControlPosition.TOP_RIGHT
},
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE,
position: google.maps.ControlPosition.TOP_RIGHT
},
};
map = new google.maps.Map(document.getElementById('map'), mapOptions);
// create layer and add to the map, then add some interactive elements
cartodb.createLayer(map, 'http://zbahrain.cartodb.com/api/v2/viz/f5073bec-b841-11e4-b79c-0e4fddd5de28/viz.json')
.addTo(map)
.on('done', function(layer) {
var subLayerOptions = {
sql: "SELECT * FROM roadscomplete where block = '525'"}
var sublayer = layer.getSubLayer(0);
sublayer.set(subLayerOptions);
sublayers.push(sublayer);
sublayer.on('error', function(err) {
cartodb.log.log('error: ' + err);
});
})
.on('error', function() {
cartodb.log.log("some error occurred");
});
map = new google.maps.Map(document.getElementById('map'), mapOptions);
// Define the LatLng coordinates for the polygon's path.
var triangleCoords = [ new google.maps.LatLng(26.1750729378,50.5527011926),new google.maps.LatLng(26.1750278514,50.5528370586),new google.maps.LatLng(26.1749037197,50.5527864969),new google.maps.LatLng(26.1749497896,50.5526475251),new google.maps.LatLng(26.1750711189,50.5526969966),new google.maps.LatLng(26.1750729378,50.5527011926), ];
// Construct the polygon.
var bermudaTriangle = new google.maps.Polygon({
paths: triangleCoords,
strokeColor: '#FFF',
strokeOpacity: 0.8,
strokeWeight: 2,
fillColor: '#EA4A38',
fillOpacity: 0.75
});
bermudaTriangle.setMap(map);
map.setMap(map);
}
window.onload = main;
我的错误。
map = new google.maps.Map(document.getElementById('map'), mapOptions);
去过两次。
相关文章:
- 如何获取谷歌地图多边形的当前fillColor
- 在谷歌地图V3上选择多边形
- 谷歌地图多边形减慢浏览器速度
- 在谷歌地图上为每个“多边形”生成新的多段线;日期“;来自mysql的值
- 谷歌地图 api v3 搜索多边形没有鼠标事件
- 单击角度谷歌地图中的多边形时如何显示窗口
- 谷歌地图/融合表Javascript HTML赢得't显示/可视化所有多边形数据(通过色标)
- CartoDb+谷歌地图多边形
- 如何在谷歌地图中制作一个覆盖世界的多边形
- 从谷歌地图drawingManager V3中删除多边形
- 如何在谷歌地图API中使用坐标数组绘制多边形
- 多边形中心谷歌地图JavaScript API v3
- 多边形过多的谷歌地图会导致iOS崩溃
- 谷歌地图多边形悬停可点击
- 检测谷歌地图 v3 多边形上的鼠标事件的 shiftKey
- 谷歌地图绘制多边形并警告重叠
- 将 XML 多边形转换为谷歌地图
- 谷歌地图多边形
- 多边形谷歌地图中的多个孔在迭代数组时
- 在多边形谷歌地图中添加多个AddListener