使用标记连接canvas菜单

我正在制作一个地图项目，我需要标记一些建筑物来显示该特定建筑的一些数据。 基本上，从字面上看，我正在尝试建立这样的东西

我找到了关闭canvas项目，我将它用于我的地图，这是一个有效的JSFIDDLE示例。 对于地图我正在使用openlayers3 ， openstreetmap ，我没有使用google-maps ，我使用它并不感兴趣，我只是参考这张图片，因为他们有一个很好的例子，这个canvas显示数据菜单。

正如你所看到的，我在NYC周围标记了不同的区域，我想，当我点击示例时，我触发canvas菜单（不要介意它会改变canvasnav-bar样式）并显示该对象的正确数据。

我的问题是：最好的方法是什么，我想学习如何将这个非canvas粘贴到我的地图上，所以标记可以触发canvas？

我知道有一个隐藏的我将其显示为汉堡图标，用于触发canvas菜单。 但我不明白如何将所有标记连接到canvas以显示每个建筑物的不同数据。

我想学习如何做到这一点？ 使用javascript或jquery会很棒，我不认为openlayers3有这种灵活性，但也许有，我对此有点困惑，有人可以帮我构建这个，谢谢。