Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/reyemtm/parcel-viewer

Open Parcel Viewer - A mobile ready web app for displaying 50k parcels or polygons without needing a GIS server.
https://github.com/reyemtm/parcel-viewer

Last synced: 15 days ago
JSON representation

Open Parcel Viewer - A mobile ready web app for displaying 50k parcels or polygons without needing a GIS server.

Awesome Lists containing this project

README 

        
## Update 7/23/17



This app uses geojson-vt to cut vector tiles on the fly. Users might also want to use Mapbox GL JS which uses geojson-vt natively. ~~however Mapbox GL JS API does not have search capabilities built in for anything not rendered in the browser window, so those would have to be added separately~~ Mapbox GL JS now has support for supplementing or using exclusively results from local sources - see [https://docs.mapbox.com/mapbox-gl-js/example/forward-geocode-custom-data/](https://docs.mapbox.com/mapbox-gl-js/example/forward-geocode-custom-data/).



## Open Parcel Viewer



This open data parcel viewer is a client-side app that uses Leaflet to render a whole county parcel map without the need for a GIS server. Try out the [demo](https://reyemtm.github.io/parcel-viewer/). This app also includes my modern-ui custom style for the search bar and layer control.



![Parcel Viewer](assets/images/parcel-img.png)



## Sites Using the Open Parcel Viewer

 - [Scott Township - Lackawanna County, Pa.](http://scotttownship.gisassetmanager.com/)



## Features

 - Search by any field or multiple fields, such as Name and/or Parcel ID

 - Sidebar, fullscreen, location, printing (using browser print dialog)

 - Render up to (approx) 50k parcels

 - Customized layer control with thumbnails

 - Similar performance on mobile and desktop



## Requirements

 - Data in topojson format, stored in the data folder - see [mapshaper](http://mapshaper.org)

 - A string field in the data titled 'index' to house the searchable attributes (with a separator - see the example)

 - Jekyll (or download the zip file and build the app manually)

 - A free Mapbox API key for using the Mapbox imagery (not necessary, the esri imagery could be used instead)

 - A (free) web server such as GitHub, surge.sh, others...



## Upgrades - Contributions Welcome

 - Create an npm package for the js dependencies

 - Convert from L.TileLayer.Canvas to L.GridLayer to be compatible with Leaflet 1.0

 - Make a Jekyll option for using vector tiles styled in Mapbox

 - Create a function to automatically split the index field and push all the index 'fields' to the popup or the sidebar

 - Add an option to add/remove more/other tools to/from the toolbar

 - Convert the toolbar from using leaflet-top leaflet-left to a new customized leaflet control

 - Documentation on the various options in geojson-vt and the drawing on canvas function

 - Add real support for multiple field search - possibly using fuse or typehead (like Leaflet Bootstrap)



## Issues

 - ~~Past zoom level 18 the parcels disappear - this is an upstream issue with geojson-vt~~ Fixed 04/2016 - The default maxZoom for L.tileLayer.canvas (and L.tileLayer) is 18. In the L.CanvasTiles.js this has been changed to 22.

 - Pinch and zoom on touch devices causes strange behavior so it is disabled, use the zoom buttons (behind the sidebar) instead

 - Zoom animations have been limited to 2 zoom levels for better performance



## Thanks

This app relies on a variety of plugins, but most importantly on the work of [mourner](https://github.com/mourner), [Sumbera](https://github.com/Sumbera), [Stephano Cudini](https://github.com/stefanocudini/) and [Matthew Bloch](https://github.com/mbloch).



This app is powered by Jekyll.