html - 如何简化 GMap 位置数组中的重复 HTML？

Question

我正在尝试在 Google Map (v3 API) 中收紧一些重复的 HTML。

• 该地图包含 50 个标记。
• 每个标记都有一个样式化的 infoWindow。
• 每个 infoWindow 都包含表示文本和图像的 HTML。
• 每个 infoWindow 的文本都是相同的，但图像是唯一的。

我想将文本 HTML 放入一个变量中，然后用它来替换代码中重复的字符串。

这是 infoWindows 的呈现方式：

var locations = [
[39.11009, -120.03169, '<same text html><unique image html>'],
[37.77493, -122.41942, '<same text html><unique image html>'],
[48.85320, -119.30206, '<same text html><unique image html>'],
[48.77734, -121.81320, '<same text html><unique image html>']
];

Answer 1

Create a variable containing the html string common to each array [], then use it to replace the common strings. The proper syntax looks like this:

var Links ='<div class="photo"><a href="whatever.com/">Shop Here</a> | <a href="whatever.com/">Shop There</a></div>';
var locations = [
[39.19, -12.9, Links + '<img width="300" height="239" src="images/img01.jpg"/>'],
[37.73, -12.4, Links + '<img width="300" height="239" src="images/img02.jpg"/>'],
[48.82, -12.3, Links + '<img width="300" height="239" src="images/img03.jpg"/>'],
[48.74, -12.8, Links + '<img width="300" height="239" src="images/img04.jpg"/>'],
[39.37, -12.7, Links + '<img width="300" height="239" src="images/img05.jpg"/>']
];