插值坐标可防止静态谷歌地图加载

时间:2018-01-20 00:01:17

标签: google-maps pug google-static-maps

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

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},

我所看到的只是一张破碎的图像。

我知道我可以访问lat和lng,因为当我创建一个段落

p #{location.coords.lat}

显示为" 51.455041"加载页面时。

1 个答案:

答案 0 :(得分:1)

以下内容来自帕格的doc

  

以前版本的Pug / Jade支持插值语法   为:

a(href="/#{url}") Link This syntax is no longer supported.

如果您将链接用作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')