16

创建谷歌地图并以给定位置为中心非常简单(见下文)。创建谷歌地图并通过执行类似的操作在其上显示标记也很简单markers=color:blue%7Clabel:S%7C11211%7C11206%7C11222

我将如何创建一个像下面这样的简单居中地图,但在最中心添加一个标记?谢谢

<img alt="Map" src="http://maps.google.com/maps/api/staticmap?center=+AUBURN+WA+98001&amp;zoom=14&amp;size=400x400&amp;sensor=false">
4

4 回答 4

7

我猜地图会自动适合显示指定的标记, 在这里你会发现

标记位置

每个标记描述符必须包含一组一个或多个位置,定义在地图上放置标记的位置。这些位置可以指定为纬度/经度值或地址。这些位置使用竖线字符 (|) 分隔。

位置参数定义标记在地图上的位置。如果该位置不在地图上,只要提供了中心和缩放参数,该标记将不会出现在构建的图像中。但是,如果未提供这些参数,静态地图服务器将自动构建包含所提供标记的图像。(请参阅下面的隐式定位。)

于 2013-04-26T21:52:32.913 回答
1

如果地图,您还可以在顶部添加自己的居中背景图像:)

background: url('yourmarker.png' ) center no-repeat, url(http://maps.google.com/maps/api/staticmap?center=AUBURN+WA+98001&zoom=14&amp&size=400x400);
于 2015-06-14T10:38:36.037 回答
1

在这里我一步一步地给出代码

NSString *strLat = [NSString stringWithFormat:@"%f",_message.latitude];
NSString *strLong = [NSString stringWithFormat:@"%f",_message.longitude];
NSString *strURL = [NSString stringWithFormat:@"%@center=%@,%@&zoom=15&size=200x200&markers=color:red%%7Clabel:C%%7C%@,%@&key=%@",https://maps.googleapis.com/maps/api/staticmap?,strLat,strLong,strLat,strLong,GOOGLE_API_BROWSER_KEY];
NSLog(@"strURL %@",strURL);
strURL = [strURL stringByReplacingOccurrencesOfString:@"%%" withString:@"%"];

现在你有一个图片网址

于 2015-12-16T05:32:00.007 回答
0

地址的谷歌静态地图参考:

https://developers.google.com/maps/documentation/maps-static/dev-guide#Addresses

这是我最近用来执行此操作的 JavaScript 函数。传递给函数的addressElements 参数是一个地址元素数组,例如['10 Main St', 'Brownsville', 'MS', '27123', 'USA']

您可以看到我已经注释掉了 center 和 zoom 属性,因为您在定义标记时不需要这些属性。要删除标记,只需取消注释这两行并注释掉标记行。

您显然可以自己构建此图像,但我使用 URLSearchParams 来简化参数创建并自动对它们进行 URL 编码。

function getGoogleMapsImage(addressElements) {
    var image = Nucleus.element('img');
    image.width = '256';
    image.height = '256';
    var joined = addressElements.join(',');
    var params = new URLSearchParams();
    //params.append('center', joined);
    //params.append('zoom', '15');
    params.append('size', '256x256');
    params.append('maptype', 'roadmap');
    params.append('key', 'YOUR_API_KEY_HERE');
    params.append('markers', 'color:red|label:C|' + joined);
    var url = 'https://maps.googleapis.com/maps/api/staticmap?' + params.toString();
    image.src = url;
    return image;
}
于 2020-05-08T18:57:32.957 回答