Dynamic Halftone (019)

Dynamic Halftone is a web interface for transforming aerial imagery into halftone representations of shadow, vegetation, and terrain.

Each layer of the halftone uses a different data source: RGB, a “natural color” image; near-infrared, or “false color” image, used to identify vegetation; and a Digital Elevation Model, an elevational rendering using greyscale pixels (USGS 1m). From each source, only one parameter was analyzed and represented: the red hue, in near-infrared, and brightness for both the RGB and DEM images. The magnitude of each is represented by the radius of a circle while the spacing within each layer is determined by the sampling area.

In reducing each base image to a single factor and overlaying them, new patterns and forms are made evident. Where do shadow, vegetation, and terrain correspond?

Interaction

Through a set of sliders, users can modify the size of the subdivision and the relative size and location of symbols. While the parameters of each layer are configurable, does this interaction constitute map-making or simply an adjustment to the representation of the same map?

The underlying data does not change, nor is there an ability to exclude or include other data. Yet the imagery data itself is still just another representation of the physical world. As with any map, representation is inherently constrained by processing methods, the data collection techniques, the data source, and the medium of presentation. In “Dynamic Halftone”, while within a set of constraints, the end user still engages with curation and culling of information.

Technical

While previous maps in this series have used Mapbox for tiling and geolocation, “Dynamic Halftone” uses Leaflet, an open source library for interactive maps for loading and positioning the appropriate tiles.

Attempts to integrate custom raster tiles into Mapbox from QGIS were a headache for many reasons: the service only supports GeoTiffs, required uploading tile sets through a separate API, and had limited documentation. But more importantly, we were starting to feel constrained by Mapbox as a platform. Instead, Leaflet, as a library, easily accepts various formats without the restrictions involved in having to upload to a proprietary service. From QGIS, the tiles for each desired zoom level (15 through 17) were automated as pngs using the QTiles plugin.

The technique of reading a loaded web map, parsing through the pixel data, and redrawing to a new canvas element was initially developed in Tile Swap (005). But as Leaflet creates maps using basic DIV elements rather than a canvas, the multiple image tiles in each map were unioned using html2canvas.

Above, an early study shows brightness halftones changing as the map pans. The study was built earlier using Mapbox with their own satellite tiles.

Next Steps
  •  Add functionality to toggle between the RGB base image and the halftone representation.
  • Add functionality to pan and zoom to different areas of New York City.
  • “Hide” the base maps in a better way, but still make them accessible to drawing.
  • Resolve performance issues — toggling the sliders takes a while to update the image.
  • Use alphanumeric characters as symbols, either drawn from the data (numeric representation of elevation) or arbitrary, e.g. does the graphic form of “7” relate to its semantic meaning?
  • Add functionality for X-Y translation, saturation, and brightness, to be determined by magnitude.
  • Add functionality for variable subside, e.g. recursively subdivide by magnitude and threshold, which would alter density.