插值坐标阻止加载静态 google 地图

Question

在网页上，我可以使用类似的东西显示静态地图。

http://maps.googleapis.com/maps/api/
staticmap?center=51.455041,-0.9690884&zoom=17&size=600x300
&sensor=false&markers=51.455041,-0.9690884&scale=2")

但是当我尝试

http://maps.googleapis.com/maps/api/staticmap?
center=#{location.coords.lat},#{location.coords.lng}
&zoom=17&size=400x350&sensor=false&markers=
#{location.coords.lat},#{location.coords.lng}&scale=2"

其中 #{location.coords.lat} 和 #{location.coords.lng} 是从这一行的控制器文件中插入的字符串。

coords: {lat: 51.455041, lng: -0.9690884},

我看到的只是一张破损的图片。

我知道我可以访问纬度和经度，因为当我创建段落时

p #{location.coords.lat}

加载页面时显示为“51.455041”。

Answer 1

以下内容来自哈巴狗的doc:

Previous versions of Pug/Jade supported an interpolation syntax such as:
a(href="/#{url}") Link This syntax is no longer supported.

如果您使用 link 作为 img 来源，正确的语法是：

img(src='http://maps.googleapis.com/maps/api/staticmap?center=' + location.coords.lat + ',' + location.coords.lng + '&zoom=17&size=400x350&sensor=false&markers=' + location.coords.lat + ',' + location.coords.lng + '&scale=2')

插值坐标阻止加载静态 google 地图

Interpolated coordinates prevent static google map from loading

google-maps

google-static-maps

pug