gistfile1.js

var D3Layer;

D3Layer = (function() {

  function D3Layer(map, points) {
    var _this = this;
    this.map = map;
    this.enabled = true;
    this.svg = d3.select(this.map.parent).append('svg').attr('class', 'd3layer');
    this.heat = d3.select(this.map.parent).append('div').attr('class', 'd3layer heatmap');
    this.points = points || [];
    this.zoom = this.map.zoom();
    this.parent = this.svg.node();
    this.heatmap = h337.create({
      radius: 10,
      opacity: 50,
      element: this.heat.node()
    });
    this.map.addCallback('zoomed', function(map, offset) {
      return _this.zoom += offset;
    });
  }

  D3Layer.prototype.named = function(name) {
    if (name) {
      this.name = name;
      return this.name;
    } else {
      return this.name;
    }
  };

  D3Layer.prototype.data = function(points) {
    this.points = points;
    return this.draw();
  };

  D3Layer.prototype.project = function(location) {
    var point;
    point = this.map.locationPoint({
      lat: location[1],
      lon: location[0]
    });
    return [point.x, point.y];
  };

  D3Layer.prototype.draw = function() {
    var drawn, extents, mapsize, markers, visible,
      _this = this;
    if (!this.enabled) {
      return;
    }
    mapsize = {
      width: $(this.parent).width(),
      height: $(this.parent).height()
    };
    extents = this.map.getExtent();
    visible = this.points.filter(function(p) {
      var x, y, _ref, _ref1;
      x = (extents.west <= (_ref = p.get('coords').lng) && _ref <= extents.east);
      y = (extents.south <= (_ref1 = p.get('coords').lat) && _ref1 <= extents.north);
      return x && y;
    });
    drawn = _.map(visible, function(d) {
      var coords;
      coords = d.get('coords');
      return {
        geometry: {
          coordinates: [coords.lng, coords.lat]
        },
        properties: {
          radius: 1000 / clustr.resolutions[_this.zoom],
          id: d.id
        }
      };
    });
    if (visible.length < MAP_MARKER_MAX) {
      if (this.heatmap.get('visible')) {
        this.heatmap.toggleDisplay();
      }
      markers = this.svg.selectAll('circle').data(drawn, function(d) {
        return d.properties.id;
      });
      markers.attr('r', function(d) {
        return d.properties.radius;
      });
      markers.enter().append("circle").attr('r', zeroish).attr('opacity', zeroish).attr('fill', '#F16635').transition().duration(450).attr('r', function(d) {
        return d.properties.radius;
      }).attr('opacity', 0.3);
      markers.attr('transform', function(d) {
        return 'translate(' + _this.project(d.geometry.coordinates) + ')';
      });
      return markers.exit().transition().duration(450).attr('r', zeroish).attr('opacity', zeroish).remove();
    } else {
      this.svg.selectAll('circle').remove();
      this.heatmap.store.setDataSet({
        max: 1,
        data: _.map(visible, function(d) {
          var coords, point;
          coords = d.get('coords');
          point = this.map.locationPoint({
            lon: coords.lng,
            lat: coords.lat
          });
          return {
            x: point.x,
            y: point.y
          };
        })
      });
      if (!this.heatmap.get('visible')) {
        return this.heatmap.toggleDisplay();
      }
    }
  };

  D3Layer.prototype.enable = function(enabled) {
    if (enabled === void 0) {
      enabled = true;
    }
    this.enabled = enabled;
    this.parent.style.display = this.enabled ? '' : 'none';
    return this;
  };

  D3Layer.prototype.disable = function() {
    return this.enable(false);
  };

  return D3Layer;

})();