Javascript 具有主干和；木偶

我在谷歌地图应用程序上工作了一段时间。应用程序正在使用Backbone和Backbone.marionete。可以在此处找到其外观的屏幕截图：

在过去的几个小时里，我一直在寻找使用主干路由器保持应用程序状态的高级示例，但我找不到比使用单路由参数更高级的示例：#关于#注释等

这就是我要做的

当用户在地图上移动时，我更改url以反映以下内容： /：lat/：lng/：zoom

当用户从右侧列表中选择任何标记时，我将url更改为： /：lat/：lng/：缩放/热点/：id

右边的列表正在使用Backbone.Paginator。因此，当用户单击任何页面时，url将更改为： /：lat/：lng/：zoom/page/：id

现在，如果用户单击热点，我想将url更改为： /：lat/：lng/：zoom/page/：id/hotspot/：id

例如，如果用户在应用程序中使用了方向功能，我希望url反映这一点：

/：lat/：lng/：缩放/方向/：开始/：结束

如果他在使用方向应用程序之前或之后使用带有热点的列表，我想将url更改为： /：lat/：lng/：zoom/方向/：start/：end/页面/：id/热点/：id

你明白了。我想让用户能够使用应用程序的任何部分，并在此之后与任何人共享链接

正如我所说，我使用的是主干网。木偶网-因此我的应用程序有很多子应用程序负责地图视图、列表视图、方向视图等

我的问题如下：

如何正确使用主干网？当用户在地图上四处移动时，我可以轻松更改/：lat/：lng/：缩放。但是现在，如果用户单击任何热点，我只通过主干。导航（'hotspot/200'）->url将更改为just#hotspot/200，带有lat/lng/zoom的部分将丢失。我上面列出的任何其他url也是如此。如果我只是传递需要添加到url的部分，主干将清除整个哈希并添加我的新部分。你是怎么处理的？您是否有一个全局函数来跟踪所有可能的url组合，并根据当前情况进行添加或替换

以这个url为例：

/：lat/：lng/：zoom/方向/：start/：end/页面/：id/热点/：id

/：lat/：lng/：zoom-地图应用程序需要此部分 方向/：开始/：结束-方向应用程序需要此部分

page/：id-热点应用程序需要此部件

hotspot/：id-hotspot应用程序需要此部件

如何管理这些URL？我基本上需要一个接一个地调用上述应用程序，以便重新创建应用程序状态

---

有没有办法做到这一切而不发疯？欢迎使用任何高级主干路由器（甚至只是HTML5历史）的示例或提示

我将创建一个

导航（newState）

类型函数，用于检查应用程序的当前状态（即URL）。使用当前URL，您可以根据您的所有条件生成下一个URL，只需将新状态添加到当前状态或在适当的情况下替换当前状态的一部分即可。完成后，调用

Backbone。使用新的URL导航