Complete Custom Overlay

complete-custom-overlay.js

'use strict';

var google = global.google;

function positionOverlayByDimensions(projectedLatLng) {
    var offsetHeight = this.el.offsetHeight,
        offsetWidth = this.el.offsetWidth;

    this.el.style.top = projectedLatLng.y - offsetHeight + 'px';
    this.el.style.left = projectedLatLng.x - Math.floor(offsetWidth / 2) + 'px';
}

function draw() {
    var projection = this.getProjection(),
        projectedLatLng = projection.fromLatLngToDivPixel(this.point);

    positionOverlayByDimensions.call(this, projectedLatLng);
}

function onAdd() {
    var panes = this.getPanes();

    panes.overlayLayer.appendChild(this.el);
}

function BaseOverlay(options) {
    var point = options.point;

    this.el = options.el;
    this.point = new google.maps.LatLng(point.lat, point.lng);

    this.el.style.position = 'absolute';
}

BaseOverlay.prototype = Object.create(google.maps.OverlayView.prototype);
BaseOverlay.prototype.constructor = BaseOverlay;

BaseOverlay.prototype.onAdd = onAdd;
BaseOverlay.prototype.draw = draw;

module.exports = BaseOverlay;