Mezcla mapas de Google superposiciones personalizadas con Backbone Vistas

Question

TL; DR

¿Es PinView.prototype = _.extend(PinView.prototype, google.maps.OverlayView.prototype) la forma "correcta" de tener una columna vertebral Ver heredan de otra "clase"?

lectura larga

Estamos rehaciendo nuestro sitio usando Backbone y estamos trabajando en la inclusión de algunas funciones de mapeo.

Tengo una vista Backbone que maneja la colocación de <div> s en puntos específicos dentro de la ventana del navegador; esto parece algo natural de ampliar para que el Map API de Google los ubique en coordenadas geográficas.

De acuerdo con Google API, para generar una superposición personalizada crea un nuevo objeto y establece el prototipo para ese objeto en una nueva instancia de google.maps.OverlayView. A continuación, poner en práctica tres funciones en la parte superior de ese objeto para que el objeto responde a:

onAdd

draw

onRemove

Dónde onAdd es responsable de generar el código HTML y luego aplicarlo en la parte superior del mapa. A continuación, llama al draw, que posiciona el elemento correctamente de acuerdo con los pares y límites LatLng que ha proporcionado. onRemove se llama cuando desea deshacerse de su capa.

Así que modifiqué mi vista para incluir estos tres métodos (que solo llaman a renderizar y deshacer y están vinculados a mi colección). Y después de hacer "que la magia suceda" Estoy haciendo:

PinView.prototype = _.extend(PinView.prototype, google.maps.OverlayView.prototype)

se ve este derecho? Puedo publicar el código para la Vista y el Modelo en el que se basa, pero, sinceramente, son irrelevantes para este ejemplo: el código funciona y puedo colocar div personalizados generados a través del modelo Backbone, la vista y los componentes del controlador en el mapa sin problema, lo que estoy preguntando, supongo (y tal vez esta pregunta sea más apropiada para los programadores. Por lo tanto, avíseme y la moveré).

Esta parece ser la manera más fácil de hacer que mi PinView sea una Vista Backbone y una Vista de superposición de Google Maps, pero no estoy 100% cómodo con la herencia prototípica para saber si estoy haciendo algo "incorrecto" o rompiendo algo en algún lugar del camino.

Answer 1

¡Bonita idea! Normalmente soy un poco escéptico sobre el clima o no eres 'correcto' cuando las cosas funcionan, así que si no te has encontrado con un showtopper y las superposiciones se muestran y hace lo que se supone que haga, diría que eres .

Una cosa que echa un vistazo más de cerca, sin embargo:

Esto no es (y no puede) ser "verdadera" herencia múltiple - que este concepto no es realmente relevante en un lenguaje basado en prototipos: una implementación de un método será inevitable "ganar" y sobrescribir la otra aplicación, al menos cuando se utiliza _.extend()

Esto significa que si hay miembros o métodos con los mismos nombres en Backbone.View y google.maps.OverlayView el última en su llamada _.extend() será el que toma el control. Pero cuando los inspecciono usando las herramientas para desarrolladores de Chrome no vi ninguna colisión obvia de este tipo.

Así que mi recomendación: continúe usando esto, solo pruebe mucho. Me encantaría ver un ejemplo de esta técnica en algún momento.

Answer 2

¡Ah! Así que he estado haciendo lo anterior, pero nunca se sintió bien.

Entonces me encontré con this discussion on a Backbone group que me lleva a la siguiente:

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; 
}()); 

De esta manera si tenemos que reemplazar cualquiera de las definiciones en una clase que estamos extend ing de, podamos ya que es anterior en el _.extend cadena (las definiciones posteriores sobrescriben definiciones anteriores).

Estoy trabajando en 'extender' extend para hacer un seguimiento de las referencias del objeto "principal" que se anularían y proporcionando un método para llamarlas todavía (como la llamada de Python super). No he decidido si esto debería hacerse a través de parche de mono, un patrón de interceptor (mediante el método de subrayado _.tap() u otra cosa, pero creo que agregará mucha flexibilidad.

Esto le permitiría definir un initialize vista en su clase "padre" que podría llamarse haciendo algo como _.super('ParentClass', 'initialize'); al final de la rutina de "niño" de la clase initialize ...