如何在Canvas中显示信息到DIV / iFrame？

Question

在我当前的项目中，我想点击开启 <canvas>，以便在iFrame或DIV中显示“已选中/点击”的对象信息。下图显示了我想要实现的目标：

• 绿色框表示我想要点击的对象。
• 橙色箭头显示信息的动作。
• 红色框表示iFrame或DIV
• 表情符号代表显示的信息。

我的主要问题是：

1. 我应该将信息存储在包含JavaScript数组的文件中，并按ID OR 将数据存储到数据库中并使用JS提取数据吗？
2. 如何使用单击的特定块中的数据填充DIV / iFrame？我可以使用window.postmessage或其他类型的工人吗？

任何指出正确方向的想法都值得赞赏。如果可以提供一个例子，那也会有所帮助！

另外，因为这是第一次这样做并开始进入JS及其衍生产品，我试图让它尽可能简单。