How to use the leaflet.geoJson function in leaflet

To help you get started, we’ve selected a few leaflet examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github Esri / esri-leaflet-renderers / src / FeatureLayerHook.js View on Github external
this._createPointLayer = function () {
    if (!this._pointLayer) {
      this._pointLayer = L.geoJson();
      // store the feature ids that have already been added to the map
      this._pointLayerIds = {};

      if (this._popup) {
        var popupFunction = function (feature, layer) {
          layer.bindPopup(this._popup(feature, layer), this._popupOptions);
        };
        this._pointLayer.options.onEachFeature = L.Util.bind(popupFunction, this);
      }
    }
  };
github CodeForPhilly / philly-ward-leaders / src / views / city-map.js View on Github external
addBoundaries: function() {
    // If both ward boundaries and ward leaders have been fetched
    if( ! _.isEmpty(this.wardBoundaries.attributes) && this.collection.length) {
      var self = this,
      colors = function(d) {
        return d >= 80 ? '#eff3ff' :
        d >= 60 ? '#bdd7e7' :
        d >= 40 ? '#6baed6' :
        d >= 20 ? '#bdd7e7' :
        '#eff3ff';
      };
      window.boundaries = L.geoJson(this.wardBoundaries.toJSON(), {
        onEachFeature: function(feature, layer) {
          if(feature.properties) {
            //layer.bindPopup(getOrdinal(feature.properties.WARD_NUM) + ' Ward');
            var models = self.collection.where({Ward: +feature.properties.WARD_NUM});
            if(models.length) {
              layer.bindPopup(self.popupTemplate(models.map(function(obj) { return obj.toJSON(); })));
            }
          }
        },
        style: function(feature) {
          var model = self.collection.findWhere({Ward: +feature.properties.WARD_NUM});
          return {
            fillColor: colors(model ? model.get('totalTurnoutPercentage') : 0),
            fillOpacity: 0.7,
            weight: 3,
            color: '#2284a1'
github knreise / KNReiseAPI / examples / wikipedia.js View on Github external
api.getWithin(dataset, c, r, function (data) {
    console.log('data', data);
    L.geoJson(data).addTo(map);

}, function (e) {
    console.error(e);
github naturalatlas / tilemantle / app / controls / Leaflet.jsx View on Github external
renderCompletedTiles() {
		var geojson = {
			type: 'FeatureCollection',
			features: this._completeTiles.map(function(tile, i) {
				return {
					type: 'Feature',
					properties: {complete: true, i: i},
					geometry: tilebelt.tileToGeoJSON(tile)
				};
			})
		};

		if (this._completedLayer) this.map.removeLayer(this._completedLayer);
		var newLayer = L.geoJson(geojson, {style: this.getTileStyle, zIndex: 9998}).addTo(this.map);
		this._completedLayer = newLayer;
	},
	render() {
github nreese / enhanced_tilemap / public / vislib / marker_types / base_marker.js View on Github external
let defaultOptions = {
        filter: function(feature) {
          const value = _.get(feature, 'properties.value', 0);
          return value >= self.threshold.min && value <= self.threshold.max;
        },
        onEachFeature: function (feature, layer) {
          self.bindPopup(feature, layer);
        },
        style: function (feature) {
          let value = _.get(feature, 'properties.value');
          return self.applyShadingStyle(value);
        }
      };
      
      if(self.geoJson.features.length <= 250) {
        this._markerGroup = L.geoJson(self.geoJson, _.defaults(defaultOptions, options));
      } else {
        //don't block UI when processing lots of features
        this._markerGroup = L.geoJson(self.geoJson.features.slice(0,100), _.defaults(defaultOptions, options));
        this._stopLoadingGeohash();

        this._createSpinControl();
        var place = 100;
        this._intervalId = setInterval(
          function() {
            var stopIndex = place + 100;
            var halt = false;
            if(stopIndex > self.geoJson.features.length) {
              stopIndex = self.geoJson.features.length;
              halt = true;
            }
            for(var i=place; i
github SUI-Components / sui-components / components / map / basic / src / leaflet / shapes / Polygons.js View on Github external
printPolygonOnMap ({ map, polygon }) {
    const params = {
      className: 'scm-map__area',
      onEachFeature: SearchMapPolygons.onEachFeature
    }

    const polygonGeoJSon = L.geoJson(polygon, params)

    this._polygonList.push(polygonGeoJSon)
    polygonGeoJSon.addTo(map)

    const polygonName = polygon.properties.Code

    if (polygonName === this.SPAIN_POLYGON_NAME) {
      const { latitude, longitude } = this.SPAIN_POLYGON_CENTER
      const centerSpain = new L.LatLng(latitude, longitude)
      map.panTo(centerSpain)
    } else {
      const bounds = polygonGeoJSon.getBounds()
      if (bounds.isValid()) {
        this.onPolygonWithBounds({ bounds, map })
      }
    }
github ngageoint / mage-server / public / app / observation / form / location-edit.component.js View on Github external
addObservation(feature) {
    if(feature.geometry){
      if(feature.geometry.type === 'Point'){
        var observation = L.geoJson(feature, {
          pointToLayer: (feature, latlng) => {
            return L.fixedWidthMarker(latlng, {
              iconUrl: this.geometryStyle ? this.geometryStyle.iconUrl : ''
            });
          }
        });
        observation.addTo(this._map);
        this._map.setView(L.GeoJSON.coordsToLatLng(feature.geometry.coordinates), 15);
        return observation.getLayers()[0];
      } else {
        observation = L.geoJson(feature, {
          style: () => {
            return this.geometryStyle;
          }
        });
        observation.addTo(this._map);

        var coordinates = feature.geometry.coordinates;
        if(feature.geometry.type === 'Polygon'){
          coordinates = coordinates[0];
        }
        this._map.fitBounds(L.latLngBounds(L.GeoJSON.coordsToLatLngs(coordinates)));
        return observation.getLayers()[0];
      }
    }
  }
github nypl-spacetime / maps-by-decade / app / containers / MapPage / index.js View on Github external
this.tileLayerMaps[newMapId] = map
          }
        }

        Object.keys(this.tileLayerMaps).forEach((existingMapId) => {
          if (!nextProps.tileLayerMaps.get(String(existingMapId))) {
            this.map.removeLayer(this.tileLayers[existingMapId])

            delete this.tileLayers[existingMapId]
            delete this.tileLayerMaps[existingMapId]
          }
        })
      }

      if (Object.keys(this.tileLayerMaps).length) {
        const bounds = L.geoJson(Object.values(this.tileLayerMaps)).getBounds()
        this.map.fitBounds(bounds)
      }
    }
  }
github ngageoint / mage-server / public / app / observation / form / location-edit.component.js View on Github external
addObservation(feature) {
    if(feature.geometry){
      if(feature.geometry.type === 'Point'){
        var observation = L.geoJson(feature, {
          pointToLayer: (feature, latlng) => {
            return L.fixedWidthMarker(latlng, {
              iconUrl: this.geometryStyle ? this.geometryStyle.iconUrl : ''
            });
          }
        });
        observation.addTo(this._map);
        this._map.setView(L.GeoJSON.coordsToLatLng(feature.geometry.coordinates), 15);
        return observation.getLayers()[0];
      } else {
        observation = L.geoJson(feature, {
          style: () => {
            return this.geometryStyle;
          }
        });
        observation.addTo(this._map);