如何管理多个Callout的显示和隐藏？

在管理多个Callout的显示和隐藏时，通常会维护一个状态数组或者一个数据结构来追踪每个Callout的状态。你可以创建一个包含Callout实例和对应显示状态的对象列表。当需要显示一个新的Callout或者隐藏某个现有的Callout时，操作这个列表即可。

以下是一个简单的示例：

let callouts = [];

map.on('click', function(e) {
  // 遍历所有Callout，如果有一个已经显示，先关闭它
  callouts.forEach(callout => {
    if (callout.isShowing()) {
      callout.hide();
    }
  });

  // 创建新的Callout并加入到列表中
  const newCallout = new UniMap.Callout({
    position: e.position,
    content: '新位置信息',
    showMultipleCallouts: true, // 或者保持为默认值，取决于需求
  });
  newCallout.show();

  // 将新Callout添加到列表
  callouts.push(newCallout);
});

// 对于需要动态控制显示或关闭的Callout，可以用以下方式操作
function toggleCallout(index) {
  callouts[index].toggle(); // 显示或隐藏指定索引的Callout
}

// 当不再需要某个Callout时，可以从列表中移除并处理清理工作
function removeCallout(callout) {
  callout.remove();
  callouts = callouts.filter(c => c !== callout);
}

在这个例子中，`toggleCallout`函数可以根据需要切换Callout的可见性，而`removeCallout`函数负责从列表中移除不再需要的Callout。