谷歌地图API v3没有被格式化
Google Map API v3 not being stylized
我试着找了一段时间,我似乎找不到答案。我实现了谷歌地图API v3到我的网站,它的工作。然而,当我试图使它风格化(简单地去饱和)时,它似乎不起作用。我尝试了很多不同的教程,但都无济于事。我也在使用Twitter Bootstrap,以节省我在CSS上的一些工作,如果这会影响什么?网站可以在这里看到。
下面是地图的脚本:
<script type="text/javascript">
function initialize() {
var styles = [
{
featureType: "all", elementType: "all", stylers: [ { saturation: -100 }
]
}
];
var mapOptions = {
center: new google.maps.LatLng(42.29900, -71.26232),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
};
</script>
我是这样把它放到HTML页面下面的:
<div class="bg-blue">
<div id="map_canvas" style="width: 100%; height: 250px;"></div>
</div>
就像我上面说的,地图显示了,但是样式没有生效。如果你能帮忙,请告诉我。我真的很感激!
您创建了您的样式,但是您还没有将它们应用到您的映射…
https://developers.google.com/maps/documentation/javascript/styling styling_the_default_map
function initialize() {
var styles = [
{
featureType: "all", elementType: "all", stylers: [ { saturation: -100 }
]
}
];
var mapOptions = {
center: new google.maps.LatLng(42.29900, -71.26232),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles: styles // <-- add this
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
mapOptions);
};
您需要在mapOptions
对象中设置styles
属性:
var mapOptions = {
center: new google.maps.LatLng(42.29900, -71.26232),
zoom: 17,
mapTypeId: google.maps.MapTypeId.ROADMAP,
styles: styles
};
http://jsfiddle.net/bTZcS/相关文章:
- 如何更改bigquery API中的计费层选项
- jQuery中是否内置了任何字符串格式化函数
- Amazon S3 REST API大小不正确
- 客户端服务器REST API captcha实现
- 使用Facebook live API创建实时视频对象时的隐私设置
- 谷歌放置API:按国家或餐馆名称搜索餐馆
- 使用ECMAScript国际化API格式化日期和时间
- 格式化人口普查 ACS API 数据以在分区统计图中使用
- 高位图表格式化程序无法在高位图表API上工作
- 使用Web API Get()正确格式化JSON
- 当尝试将文件上传到Google drive api时,出现404提示,怀疑是数据格式化问题
- 谷歌地图API-格式化的电话号码显示为未定义的列表在侧栏上
- 如何在Google Visualization API中格式化折线图上的水平轴标签
- 在API调用后格式化的AngularJS指令
- 如何从Laravel API传递Javascript日期对象(格式化的datetime)
- 如何为谷歌数据表编写自定义格式化程序(用于可视化api)
- 从Facebook重新格式化JSON字符串's图形API与JS
- 使用Java API格式化JavaScript
- 谷歌地图API v3没有被格式化
- 为谷歌图表Api编写一个自定义格式化程序