Javascript 我的融合表不会按照我希望的方式设计样式,即使我遵循了融合表示例代码。我做错了什么?
我试图控制我的地图的颜色,但它似乎不起作用 我跟着,但没用。我的代码如下。尝试设置地图样式从第132行开始。这些评论对我来说只是一个有用的提示,因为我刚刚涉足JavaScript和Fusion Tables APIJavascript 我的融合表不会按照我希望的方式设计样式,即使我遵循了融合表示例代码。我做错了什么?,javascript,google-fusion-tables,Javascript,Google Fusion Tables,我试图控制我的地图的颜色,但它似乎不起作用 我跟着,但没用。我的代码如下。尝试设置地图样式从第132行开始。这些评论对我来说只是一个有用的提示,因为我刚刚涉足JavaScript和Fusion Tables API <!DOCTYPE html> <html> <head> <style> #map-canvas { width:800px; height:600px; } </style> <sc
<!DOCTYPE html>
<html>
<head>
<style>
#map-canvas { width:800px; height:600px; }
</style>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
var map;
var layer;
var cz = {
center: new google.maps.LatLng(40, -95),
zoom: 4
};
var locationColumn = 'geometry';
var tableRegion = 4437529;
var mapStyle = [
{
featureType: 'all',
elementType: 'all',
stylers: [
{ saturation: 99 }
]
},
{
featureType: 'road.highway',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'road.arterial',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'road.local',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'administrative.country',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'administrative.locality',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'administrative.neighborhood',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'administrative.land_parcel',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'poi',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
},
{
featureType: 'transit',
elementType: 'all',
stylers: [
{ visibility: 'off' }
]
}
];
var map_options = {
center: cz["center"], //Accesses the 'center' property of the 'cz' object
zoom: cz["zoom"], //Accesses the 'zoom' property of the 'cz' object
mapTypeId: google.maps.MapTypeId.ROADMAP, //Type of map.
zoomControlOptions: { //control options for the 'zoom' action of Google Maps
style: google.maps.ZoomControlStyle.SMALL, //Makes the zoom function on the upper-left-side of Google Maps small -- instead of a scale-like thing, it's just a plus and minus
position: google.maps.ControlPosition.LEFT_CENTER //Puts Zoom function center-left
},
streetViewControl: false, //Turns off Street View option
panControl: false, //turns off the circular pan button in nupper-left
mapTypeControl: false //Turns off 'MAP/SATELLITE' option in upper-right
};
var locationQuery = {
select: locationColumn,
from: tableRegion
};
function initialize() {
//new Google Map with the 'map_options'
map = new google.maps.Map(document.getElementById('map-canvas'), map_options);
//Styles the map so it removes roads, saturates things, etc. See 'mapStyle'
var style = mapStyle;
var styledMapType = new google.maps.StyledMapType(style, {
map: map,
name: 'Styled Map'
});
map.mapTypes.set('map-style', styledMapType);
map.setMapTypeId('map-style');
//Makes the Fusion Tables layer, querying the polygon location info
layer = new google.maps.FusionTablesLayer({
query: locationQuery,
//Here's where I try setting the colors and conditions for my map. Doesn't work.
styles: [{
polygonOptions: {
fillColor: "#FFFFFF",
fillOpacity: 0.5
}
},{
where: "price > 200",
polygonOptions: {
fillColor: "#FFFF00",
fillOpacity: 0.5
}
}]
});
layer.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
你还没有说明你的确切问题是什么,只是它不起作用。不是很有帮助。所以我猜。 你的地图对我很有用。没问题。尝试在下面的代码中设置fillOpacity:1,以查看它是否正常工作。通过使用.5,您可以允许底图颜色与FT层颜色混合
styles: [{
polygonOptions: {
fillColor: "#FFFFFF",
fillOpacity: 0.5
}
},{
where: "price > 200",
polygonOptions: {
fillColor: "#FFFF00",
fillOpacity: 0.5
}
}]
熔丝可能有问题。当我尝试在本地运行它时,它对我也不起作用。我得到了带有可怕数据的互动程序,可能仍在加载、拖动或刷新页面,以发现,当我最终找到它时,它起了作用,但它在本地也起了作用。啊,我现在明白我的问题是多么混乱和模糊。我应该说地图不会加载。对此我深表歉意。真有趣。在我发布这个问题的那天晚上,我请几个朋友试用这个代码。他们还报告说,只有数据可能仍在加载。然而,我只是在另一台机器上尝试了这段代码,它成功了。