Google maps api 3 将谷歌地图自定义覆盖图与主干视图混合使用

TL；DR

PinView.prototype=\uu.extend（PinView.prototype，google.maps.overlyview.prototype）

让主干视图从另一个“类”继承的“正确”方式吗

长时间阅读

我们正在使用主干网重做我们的站点，并正在努力包括一些映射功能

我有一个主干视图，可以将

放置到浏览器窗口中的特定点上；为了让Google的MapAPI将它们放置在地理坐标上，这似乎是一个自然的扩展

根据，为了生成自定义覆盖，您需要创建一个新对象，并将该对象的原型设置为google.maps.OverlayView的新实例。然后在该对象上实现三个函数，以便该对象响应：

onAdd

draw

onRemove

其中，

onAdd

负责生成HTML，然后将其应用于地图顶部。这随后调用

draw

，它根据您提供的LatLng对和边界正确定位元素

onRemove

在您想要删除图层时被调用

因此，我修改了视图以包含这三个方法（它们只调用render和unender，并绑定到我的集合）。然后让“魔法发生”我在做：

PinView.prototype=\uu.extend（PinView.prototype，google.maps.overlyview.prototype）

这个看起来对吗？我可以发布视图及其所基于的模型的代码，但老实说，它们与本例无关——代码有效，我可以将通过主干模型、视图和控制器组件生成的自定义

div

s毫无问题地放在地图上（也许这个问题对程序员来说更合适，所以请告诉我，我会提出它）

---

这似乎是使我的PinView同时成为主干视图和Google Maps OverlayView的最简单方法，但我对原型继承不是100%满意，因为我不知道我是否做了“错误”的事情或者在路上的某个地方弄坏了什么东西。

好主意！我通常对天气有点怀疑，如果事情进展顺利，你是“正确”的，那么如果你没有遇到一个止损者，覆盖层出现了，并且做了你应该做的事情，我会说你是

不过，有一件事需要仔细检查：

这不是（也不可能是）“真正的”多重继承——这一概念在基于原型的语言中并不真正相关：一个方法的一个实现将不可避免地“获胜”，并覆盖另一个实现，至少在使用

.extend（）

这意味着，如果在

Backbone.View

和

google.maps.overlyview

中有同名的成员或方法，则

.extend（）

调用中的最后一个将接管。但当我使用Chrome的开发工具检查它们时，我没有看到任何明显的此类冲突

---

因此，我的建议是：继续使用这个方法，只需进行大量测试。我希望有一天能看到这个技术的一个例子。

啊！所以我一直在做上述工作，但感觉从来都不对

然后我发现了这一点，从而得出以下结论：

var MyView = (function(){
    var view = function(){
        Backbone.View.apply(this, arguments);
    };

    view.extend = Backbone.View.extend;

    _.extend(view.prototype, Backbone.View.prototype, google.maps.OverlayView.prototype, [other prototypes...], { [VIEW DEFINITION] });

    return view;
}());

通过这种方式，如果我们需要覆盖某个类中的任何定义，我们可以从中扩展，因为它位于

.extend

链中的较早位置（稍后的定义覆盖较早的定义）

我正在进行“扩展”

extend

，以跟踪将被覆盖的“父”对象的引用，并提供一种方法来仍然调用它们（如Python的

super

调用）。我还没有决定是否应该通过monkey patching（一种拦截器模式）（通过下划线的

.tap（）

方法或其他方法，但我认为这会增加很多灵活性

---

这将允许您在“parent”类中定义一个

initialize

视图，可以通过在“child”末尾执行类似于

.super（'ParentClass'，'initialize'）；

的操作来调用该视图类的

initialize

routine…

Hm，将PinView作为BackboneView，并将google maps OverlayView作为链接到该覆盖的PinView上的属性，实际上可能会更干净。不确定google类的内部结构，因为它们被所有的缩微功能所掩盖，但我认为我更愿意避免将这两种功能混用，因为它们是这是一种不同类型的类，谁知道会发生什么（尽管如果它有效，请让我们知道！）。我非常愿意尝试更多的东西——如果我有时间的话，呃！它有效，我想我的问题更多的是“你是如何使用原型继承实现多重继承的”，而不是“我真的应该这样做吗？”主干的东西是超级干净的，我们都考虑过了，所以我不担心原型名称空间的冲突，虽然Google源代码被缩小了，但当你在调试器中使用它时，OverlayView（）的原型对象实际上也非常简单。tkone：谢谢你更新的答案，你能发布你的工作代码吗，我也尝试使用OverlayView和主干视图，但没有成功。我喜欢这种方式，但出于某种原因，我似乎无法使它工作。在下划线的更高版本中（例如1.1.2），

。
扩展无法按预期工作。您必须使用自定义扩展方法（我从下划线1.0.0复制了该方法）@Koen.因为像semver一样？为什么要麻烦！@tkone你是什么意思？@Koen.semver会规定一个未弃用的API不能在主要版本中更改功能。因此，如果
.extend
在1.1.2中的工作方式与在1.x之前（或之后）中的工作方式不同，它就破坏了semver契约。下划线因这种行为而臭名昭著。（我不再使用下划线的原因）