小编geo*_*zip的帖子

Google使用其他颜色映射v3默认标记路径

我的目标是改变漂亮的默认谷歌地图标记的颜色.因此,我正在寻找默认(红色)路径/形状.我发现这会变成颜色:

function pinSymbol(color) {
    return {
        path: '???' 
        fillColor: color,
        fillOpacity: 1,
        strokeColor: '#000',
        strokeWeight: 2,
        scale: 1
    };
}
Run Code Online (Sandbox Code Playgroud)

所以,通过调用函数,我想改变颜色(例如icon:pinSymbol("#666").但是,我不知道在哪里找到路径?我不是在寻找v2/plain标记!

新标记

//编辑:我找到了这条路径:

path: 'M 0,0 C -2,-20 -10,-22 -10,-30 A 10,10 0 1,1 10,-30 C 10,-22 2,-20 0,0 z M -2,-30 a 2,2 0 1,1 4,0 2,2 0 1,1 -4,0',
Run Code Online (Sandbox Code Playgroud)

(来自问题的答案:Google Maps API 3 - 默认(点)标记的自定义标记颜色)

如何生成平滑渐变?

google-maps colors google-maps-api-3 google-maps-markers

12
推荐指数
2
解决办法
1万
查看次数

在相同的html页面谷歌地图上使用initMap和initAutocomplete

我有一个网页,我想使用地方自动完成以及带标记的谷歌地图.用户可以搜索到位自动填充的地址.标记的Lat-long数据来自DB,这不会改变.问题是地图是否有效或是否存在自动填充,但两者都不是,问题与回调有关.

从谷歌文档中,我在单独的API调用中包含了两个回调:

<script src="https://maps.googleapis.com/maps/api/js?key=[API KEY]&signed_in=true&libraries=places&callback=initAutocomplete" async defer></script>
<script async defer src="https://maps.googleapis.com/maps/api/js?key=[API KEY]&callback=initMap"></script>
Run Code Online (Sandbox Code Playgroud)

但这会在控制台上引发错误,并且没有任何效果.

错误:您已在此页面上多次添加Google Maps API.这可能会导致意外错误.

我的问题是:如何将多个回调传递给Google API?

google-maps google-places-api

12
推荐指数
1
解决办法
1万
查看次数

在通过loadGeoJson()加载的功能上创建Infowindows

如果这是基本的,我道歉,但我的javascript知识非常有限.

我正在创建一个地图,使用ogr2​​ogr将我在ArcGIS中创建的GeoJSON数据重新格式化为GeoJSON.我已经从地图加载并显示了我的GeoJSON文件中的点标记,我甚至还有一个styleFeature()功能,可以根据属性在功能上设置样式.

我遇到的问题是在点击点功能时尝试弹出信息窗口.

我已成功使用代码设置事件侦听器并使用单击的功能更新div的内容:

map.data.loadGeoJson('http://www.myurl.com/file.json');

map.data.setStyle(styleFeature);

map.data.addListener('click', function(event) {
    var myHTML = event.feature.getProperty('Description');
    document.getElementById('info-box').innerHTML = myHTML;
});
Run Code Online (Sandbox Code Playgroud)

我想要做的是有一个事件发起像这样的infowindow,这不起作用:

map.data.loadGeoJson('http://www.myurl.com/file.json');

map.data.setStyle(styleFeature);

map.data.addListener('click', function(event) {
    var myHTML = event.feature.getProperty('Description');
    var infowindow = new google.maps.InfoWindow({content: myHTML});
});
Run Code Online (Sandbox Code Playgroud)

我的数据集由超过一千个点组成,所以硬编码信息不起作用,我没有看到任何示例显示如何创建一个infowindows数组,因为功能在setStyle()任一个调用的函数中循环.

我知道这与我对缺乏理解范围,事件和对象数组有关,但我只是碰壁.

任何帮助,将不胜感激.

javascript geojson infowindow google-maps-api-3

11
推荐指数
1
解决办法
1万
查看次数

谷歌地图api v3背景颜色

我在谷歌地图上放置了一个自定义地图png.我已将所有内容从谷歌地图中移除,只显示我的自定义地图.背景颜色是浅蓝色,我想将其更改为白色.这是代码:

function initialize() {

  var myLatLng = new google.maps.LatLng(39, -98.5);
  var myOptions = {
    maxZoom: 4,
    minZoom: 4,
    zoom: 4,

    panControl: false,
    draggable: false,
        center: myLatLng,
    disableDefaultUI: true,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
    backgroundColor: '#FFFFFF'
  };

  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  var mapStyles = [
  {
    featureType: "all",
    stylers: [
      { visibility: "off" }]
    }];

map.setOptions({styles: mapStyles});
}
Run Code Online (Sandbox Code Playgroud)

它只闪烁白色,然后变为淡蓝色.如何将其设置为白色或透明?

google-maps

10
推荐指数
2
解决办法
3万
查看次数

将Google地图v3中的标记放在所有其他标记之前

有人可以帮助我把当前位置放在所有其他位置前吗?我已经阅读了有关MAX_ZINDEX和setZindex()但我无法理解的内容.这是我的代码:

var latlng = new google.maps.LatLng(lat,lng);
var image = "";
var currentplace = "Ohla Hotel";
var zInd = "";
if( name == currentplace ) {
    image = "../img/hotel_icon.png";
}
else {
    image = "../img/home_icon.png";
}
//alert();
var maxZindex = google.maps.Marker.MAX_ZINDEX;
if( name == currentplace ) {
    zInd = (maxZindex + 1);
}
var locationDescription = this.locationDescription;
var marker = new google.maps.Marker({
    map: map,
    position: latlng,
    title:'pk:'+name,
    MAX_ZINDEX: zInd,
    icon: image
});
bounds.extend(latlng);
setMarker(map, marker, name, locationDescription);
Run Code Online (Sandbox Code Playgroud)

google-maps-api-3 google-maps-markers

10
推荐指数
1
解决办法
7727
查看次数

Google地图:实时绘制和更新折线

我真的是JS的新手,很抱歉,我没有附加任何代码,因为我所做的一切 - 来自Google Map Docs的"helloworld"示例.

那么,有什么问题:我想根据用户的当前位置绘制折线.所以,每个google.maps.LatLng()都应该有坐标.在地图上应该出现整个更新方式,例如,每5秒更新一次.最后一点,就像在地图上行走的早晨的可视化,就像那样.

我知道,如何"绘制"地图并在var flightPlanCoordinates []中添加点,我要求一些示例或链接,我可以在其中找到:

  • 如何将当前位置添加到var flightPlanCoordinates []
  • 如何在"实时"模式下更新所有这些内容

谢谢你的帮助 :)

UPD:

试图做这样的事情,但不起作用

var path = poly.getPath();

var latitude  = position.coords.latitude;
var longitude = position.coords.longitude;

path.push(new google.maps.LatLng(latitude, longitude));
Run Code Online (Sandbox Code Playgroud)

UPD2:这是一个很酷的例子,应该如何http://kasheftin.github.io/gmaps/

javascript html5 google-maps google-polyline

9
推荐指数
1
解决办法
2万
查看次数

Google Maps API v3不使用多边形突出显示国家边框

我需要强调一个国家的边界​​ - 比方说瑞士.我已经使用FusionTablesLayer实现了它:

        var layer = new google.maps.FusionTablesLayer({
                    query: {
                        select: 'geometry',
                        from: '1N2LBk4JHwWpOY4d9fobIn27lfnZ5MDy-NoqqRpk',
                        where: "ISO_2DIGIT IN ('CH')"
                    },
                    styles: [
                        {
                            polygonOptions: {
                                strokeColor: "#FF0000",
                                fillOpacity: "0"
                            }
                        }
                    ]
                });

                layer.setMap(map);
Run Code Online (Sandbox Code Playgroud)

问题在于,绘制的边界太直

截图

是否有可能使用某种搜索请求,因为如果我去谷歌地图并搜索瑞士,国家边界将以浅粉色突出显示.这已经满足了我的要求.查看地图

提前致谢

html javascript google-maps-api-3

9
推荐指数
1
解决办法
1万
查看次数

谷歌地图按IP地址的密钥限制不起作用

我试图通过使用IP地址设置密钥限制来限制对我的Google Maps API帐户的访问.以前我可以使用HTTP Referrer设置密钥限制,但我似乎无法使用IP地址获得相同的配置.我已经生成了一个与IP地址一起使用的新密钥(在工作时使用HTTP Referrer保持当前的状态).

作为示例,我可以从localhost/*访问MAPS API,但无法从127.0.0.1访问它(使用具有AP地址密钥限制设置的新API密钥).我的实际网站托管在共享服务器上,使用带有HTTP引用限制的域名(perfectpets.com.au)都很好,但如果我使用具有IP地址限制的新API密钥,则会收到RefererNotAllowedMapError错误.

任何有关如何实现这一目标的提示将不胜感激.

google-maps-api-3

9
推荐指数
1
解决办法
8055
查看次数

重新加载页面时,Kml图层不会更新

[编辑]似乎问题来自谷歌地图需要一些时间来更新KML链接...我不确定,但最终,它的工作... [/编辑]

我在这个网站上嵌入了一个现有的公共谷歌地图:http://www.ridetheflavour.fr

以下是公共地图的链接:https://maps.google.fr/maps/ms?msa = 0&msid = 211027213468691902621.0004c8616605648d245b2

如您所见,网站嵌入式地图的标记与公共谷歌地图标记不匹配.看来这不是浏览器缓存的问题......

这是我正在使用的javascript片段(谷歌地图API V3):

var mapOptions = {
          center: new google.maps.LatLng(24.797409,-5.449219),
          zoom: 3,
          mapTypeId: google.maps.MapTypeId.TERRAIN,
          overviewMapControl: false,
          streetViewControl: false
        };
var map = new google.maps.Map(document.getElementById("map_canvas"),
            mapOptions);
var georssLayer = new google.maps.KmlLayer('https://maps.google.fr/maps/ms?ie=UTF8&authuser=0&msa=0&output=kml&msid=211027213468691902621.0004c8616605648d245b2');
georssLayer.setMap(map);
Run Code Online (Sandbox Code Playgroud)

任何帮助将不胜感激.

javascript google-maps kml

8
推荐指数
1
解决办法
5298
查看次数

Google Maps API - Radius使用Places搜索标记?

我使用API​​ v3设置了Google Map.地图上有许多带有信息框的标记.我希望在地图外部设置一个搜索框,供用户输入地址,然后根据距离(例如半径搜索)返回最近的标记.

从API文档中我认为我需要使用Places服务.谁能指出我正确的方向?

google-maps google-maps-api-3 google-maps-markers google-places-api

8
推荐指数
1
解决办法
3万
查看次数