任何人都可以解释为什么渐变不适用于下面的 map 吗？
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><html><head><title>Riks.txt - Google Fusion Tables</title>
<style type="text/css">
html, body, #map_canvas {
margin: 0;
padding: 0;
height: 100%;
}
</style>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?v=3.7&sensor=false">
</script>
<script type="text/javascript">
function initialize()
{
map = new google.maps.Map
(document.getElementById('map_canvas'),
{
center: new google.maps.LatLng(59.53726545292721,18.12209266712103),
zoom: 11,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
layer = new google.maps.FusionTablesLayer({
map: map,
heatmap: { enabled: false },
query: {
select: "MP",
from: "1TlGuMJwdZy-75LQvyEEq6GrvDob2LRREWI60Ji4",
where: ""
},
styles: [
{
styleId: 2,
polygonOptions: {
fillOpacity: 1,
fillColorStyler: {
expression: "MP",
min: 0,
max: 100,
gradient: ['#0000ff', '#00ffff', '#00ff00', '#ffff00', '#ff0000']
},
strokeWeight: 1,
strokeOpacity: 0.3,
strokeColor: '#000000'
}
}
]
});
layer.setOptions({
styleId: 2,
templateId: 0
});
}
google.maps.event.addDomListener(window, 'load', initialize);
</script></head>
<body><div id="map_canvas"></div></body></html>
最佳答案
我找不到动态应用渐变的语法(你的示例来自哪里？)。有一个description of the styles that are returned by Fusion Tables ，但返回样式的语法似乎不起作用。所以我的猜测是，(还？)不可能做到。
但是，如果动态执行此操作对您来说并不重要，您可以在 Fusion Tables Web UI 中定义渐变:
如果您想创建多种样式，可以添加多个 map 。为此，您必须切换到新外观(请参阅右上角 Web ui 中的链接“切换到新外观”)。然后您可以使用“+”按钮添加新 map :
如果您在 Web UI 中指定了所需的所有样式，则可以 start to use them in FusionTablesLayer像这样(我复制了你的表格来测试):
layer = new google.maps.FusionTablesLayer({
map: map,
query: {
select: "MP",
from: "1oCgiRAPUPp638T1XJlR98IGLMIdhHQiyR-IY85E",
where: ""
},
styleId: 2
});
styleId 1 是默认值，然后 2 是您添加的第一个，3 是第二个，依此类推。我为复制的表格创建了 2 种样式。
这里是 jsFiddle 上可供尝试的示例:http://jsfiddle.net/odi86/gPjE3/
只需将 styleId: 2(MP 列的渐变)更改为 styleId: 3(M 列的渐变>) 看看会发生什么。
我希望这会有所帮助。
关于google-maps - 融合表层的渐变，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11791898/