Php makeMarker（）谷歌地图边栏格式

不知是否有人能帮助我

首先，我对这方面比较陌生，所以请您耐心等待

我已经把页面放在一起，允许用户显示和隐藏谷歌地图标记和与他们选择的“类别”复选框相关的“侧边栏”项目

我现在正试图改变侧边栏的格式，使其类似于页面上显示的格式，这是一个很大的困难

与上面链接中的示例一样，我还想添加一个功能，即如果单击地图标记，关联的边栏项将高亮显示

我已经试着让它工作了很长一段时间了，但我似乎只是在兜圈子

我只是想知道是否有人能看到这一点，并提供一些指导，我可能能够实现这一目标

---

非常感谢和亲切的问候

我试一试，只需替换以下代码：

google.maps.event.addListener(marker, 'click', function() { 
   infowindow.setContent(contentString);
   infowindow.open(map,marker); 
});

google.maps.event.addListener(map, 'click', function() { 
   infowindow.close(); 
});

对于这一个：

google.maps.event.addListener(marker, 'click', function() { 
   infowindow.setContent(contentString);
   $("#sidebar a").css('background-color','');//remove sidebar links back colors
   sidebarlink = $("#sidebar a:contains('"+marker.mydescription+"')");
   sidebarlink.css('background-color','#58FAD0');
   infowindow.open(map,marker); 
});

google.maps.event.addListener(map, 'click', function() { 
   $("#sidebar a").css('background-color','');//remove sidebar links back colors
   infowindow.close(); 
});

这将为侧边栏链接设置背景色，您可以将颜色更改为您想要的颜色，或将任何其他css样式添加到链接中

还要确保

mydescription

变量中的描述文本不包含引号

“

或双引号

”

，否则会导致上述代码失败

让我知道这工作是否如你所期望的那样

此外，如果您希望在单击地图的任何位置（例如，单击标记外部）时也从侧边栏链接中删除背景色，请替换以下代码：

google.maps.event.addListener(marker, 'click', function() { 
   infowindow.setContent(contentString);
   infowindow.open(map,marker); 
});

google.maps.event.addListener(map, 'click', function() { 
   infowindow.close(); 
});

对于这一个：

google.maps.event.addListener(marker, 'click', function() { 
   infowindow.setContent(contentString);
   $("#sidebar a").css('background-color','');//remove sidebar links back colors
   sidebarlink = $("#sidebar a:contains('"+marker.mydescription+"')");
   sidebarlink.css('background-color','#58FAD0');
   infowindow.open(map,marker); 
});

google.maps.event.addListener(map, 'click', function() { 
   $("#sidebar a").css('background-color','');//remove sidebar links back colors
   infowindow.close(); 
});

要在侧边栏链接上悬停（第1期）更改背景颜色，只需将以下css代码添加到任何

块中：

#sidebar a:hover{
   background-color: #58FAD0;   
}​

---

你所说的边栏到底是什么意思？我似乎错过了它..嗨@Mansfield，谢谢你花时间查看并回复我的帖子。对不起，我应该说得更清楚一点。如果你使用我在原始帖子中提供的第一个链接，它将打开一个页面，其中显示4个复选框、一个地图和两个橙色列表项。在那里在我的示例中显示了两个项目，这些项目是“侧栏”。然后，复选框确定地图上显示的标记类别。选择和取消选择这些项目将使侧栏项目出现并从“侧栏”中消失。非常感谢，我理解。如果到今天晚上还没有回答g当我到家时，我会尝试一下。嗨@Mansfield，非常感谢你。我期待着收到你的来信。非常好的regardsHi@Nelson，感谢你花时间把这一切整理好。遗憾的是，它不完全起作用。侧边栏列表“悬停”上的背景颜色似乎没有变化。如果使用r选择一个标记，链接的“侧边栏”项目的背景确实会改变颜色。但是，当选择第二个标记时，它不会恢复为默认背景颜色。我已经更新了我在原始帖子中包含的链接来说明这一点。我也有点担心“mydescription”不能包含

code

或”。这限制了用户的输入。友善的regards@IRHM感谢您的良好反馈，您发现了两个问题，1）悬停不起作用，2）背景色不干净。我已经修复了第2期），请参阅我的更新答案，在这里我还添加了一些代码，以防您在单击外部标记时也希望清理背景，但在地图中，该行为不是由您显示的页面完成的。。。。但在我看来，这可能是对你的页面的一个改进。我刚刚更新了我的答案，以解决问题1）查看我的css中的悬停效果。嗨@Nelson，这真的很好。这正是我要找的。非常感谢您花了这么多时间、这么多麻烦和这么多努力。我要把赏金赏给你。友善的regards@IRHM谢谢你的好话，我很高兴你喜欢它：-）