Tag Archives: map club

Map Club — WORKSHOP (Part II) — Introduction to Mapping in D3.js

20160901_banner_fall_v1

In its final session of the semester, Map Club embarked upon the second half of a two-part workshop focused on D3.js, a JavaScript library for manipulating documents based on data. This time, participants focused on learning how to render a simple SVG map in the browser, which could serve as the basis for visualizing custom values.

Beginning with a CSV file containing the locations of art galleries within New York City, as well as a GeoJSON file encoding the boundaries of the five boroughs, the workshop guided participants through the process of visualizing the locations of the galleries in the form of a basic dot map.

01

02

04

daniel_01

From top: a dot map visualizing the locations of art galleries in NYC, a snippet of GeoJSON data, the D3.js Mercator projection, the locations of LinkNYC wifi portals by Daniel Chi Cook

Thank you to everyone who participated in Map Club this fall! Until next time, best of luck in your geospatial endeavors.

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — WORKSHOP (Part I) — D3.js

20160901_banner_fall_v1

In its second to last session, Map Club took on the first part of a guided introduction to D3.js. D3.js is a JavaScript library for manipulating documents based on data. This workshop, focusing on the general setup and visualization capabilities of the library, led participants through the basics of SVG, data types, and generating simple shapes from custom arrays.

At root, complex visualizations are comprised of basic elements. Jacques Bertin’s six retinal properties describe the different visual attributes one can use to differentiate between data-driven shapes. With some help from the MDN SVG element reference, attendees learned how to apply graphic styles to SVG primitives in the browser, achieving Bertin’s vision with a few lines of code.

bertin

01

chart

From top: Jacques Bertin’s six retinal properties, a series of colorful circles from a workshop example, a stacked bar chart generated using D3.js

Map Club will meet for its final session of the semester on the afternoon of December 2nd. We will walk through basic geovisualization capabilities in D3.js, building upon the knowledge introduced in this workshop. Hope to see you there!

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — Cartogram Hexmaps with Tilegrams

20160901_banner_fall_v1

The latest session of Map Club took a data journalism bent: last Friday, we focused on creating cartogram hexmaps with Tilegrams, a generator by data visualization studio Pitch Interactive. The tool enables users to quickly create proportionate hex-based maps of the United States using custom or built-in data, and export generated maps to both SVG and topojson.

Tilegrams provides intricate functionality for tweaking state proportions to be statistically accurate, and is relatively versatile in its export capabilities. It did have a tendency to lose state labels and borders in its SVG output, providing a less-than-detailed file for download than the browser would reflect. Participants nonetheless created a range of interesting images, uploading Tilegrams topojson data to the geojson.io interface (a tool that Map Club explored in a session from earlier this semester), downloading and visualizing data from the U.S. Census (2010), and editing and rendering a custom CSV file in the data upload window.

ruoran_edited_02

daniel_edited

emily

From top: population count Tilegrams topojson file imported into geojson.io by Ruoran Lin, urban populations by state (US Census 2010) by Daniel Chi Cook, population counts per state (working)

Next week, for its penultimate session, our meeting will be a guided workshop focused on a general introduction to the D3.js JavaScript library. Part II of the D3.js workshop, focused specifically on geovisualization, will take place after Thanksgiving. Hope to see you there!

Map Club has a mailing list! Sign up here if you would like to receive updates on future sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — WORKSHOP — Introduction to QGIS

20160901_banner_fall_v1

Last Friday, Map Club embarked upon its second workshop of the semester. This time, we focused on QGIS, a free and open source geographic information system that offers powerful tools for data editing, viewing, and analysis. Participants learned how to import shapefiles into the interface, explore data using the attribute table, and visualize land use in Manhattan with public building footprint data. 

01

02

03

daniel

From top: zoom to layer, attribute layer, land use map, Daniel Chi Cook

This coming Friday will be a free-form hack session on CartoGrid, a grid-based cartogram generator. Hope to see you there!

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — Dynamic Mapping with OpenLayers

20160901_banner_fall_v1

The latest session of Map Club focused on OpenLayers, a high-performance library for rendering geographic information in the browser. OpenLayers enables users to visualize a diverse range of geospatial data formats, while offering intuitive links to external web-based mapping resources such as CARTO, OpenStreetMap, Stamen, and D3.js.

Participants explored OpenLayers functionality for importing KML and GeoJSON data, experimented with linking to different tile sets, and tried out the customizable interactive capabilities of the library in JavaScript.

01

04_02

frank

From top: imported KML data, Stamen toner labels tile set, Frank Nitsche

Next week will be the second guided workshop of the semester. We will be digging into QGIS, a free and open source geographic information system that offers powerful tools for data editing, viewing, and analysis. Hope to see you there!

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — Interactive Maps with Mapzen

20160901_banner_fall_v1

Last week, Map Club revisited Tangram, the powerful open-source renderer for Mapzen. (We first explored Mapzen over the summer.) Mapzen is an open, sustainable, and accessible mapping platform that offers intricate control over the design of web-based maps.

Centered on a map of Manhattan, attendees referenced the comprehensive documentation page to alter the drawing style of Tangram’s vector tile service. Tangram is connected to the OpenStreetMap database, and leverages OpenGL and shader language to enable mapmakers to fine-tune the visual effects of rendered data. The custom YAML syntax through which Tangram maps are styled provided a readable way of adjusting the visual attributes of the city in unexpected ways.

rachael

Emily_01_128_1000_02

From top: Vibrant map by Rachael, animated water and building coloring using GLSL

There will be no Map Club session next Friday! The following Friday (10/28), we will be looking at OpenLayers, a high-performance library for rendering geographic information in web pages.

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — WORKSHOP — Interactive Maps with CARTO

20160901_banner_fall_v1

Map Club’s most recent meeting was a change of pace from the usual self-paced rhythm of weekly sessions. In the first of three workshops occurring throughout this semester, we walked through a guided introduction to CARTO. CARTO (formerly CartoDB) is a unified web mapping and visualization engine that facilitates the creation of interactive maps. This workshop covered the process of downloading data, importing data into CARTO, filtering and visualizing attributes, and publishing a finalized custom webmap.

The datasets for this workshop were downloaded from the Global Forest Watch Open Data Portal, and specifically focused on Indonesia wood fiber concessions.

01_map_view

02_data_view

07_cartocss

12_final

screen-shot-2016-10-15-at-9-41-56-am

From top: Map view after import, data view, categorical color scale, map of Indonesia wood fiber concessions by Emily Fuhrman, map of earthquakes between 1960 and 2016 of magnitude > 6.0 by Neville Shane

The final map from the guided tutorial visualizes the different groups in the downloaded dataset to whom Indonesian forest areas are allocated. More details on the data may be found here. As always, thank you to everybody who attended, and hope to see you next session!

Sign up here if you would like to receive updates on future Map Club sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — Simple Maps with geojson.io

20160901_banner_fall_v1

Map Club spent last Friday’s session exploring geojson.io, a simple, open-source editor for map data. geojson.io seeks to be a quick tool for creating, viewing, and sharing maps. Compatible with a number of different data formats, the interface of the tool offers basic styling functionality, as well as enables Github users to turn any map into a shareable secret Gist for collaborative viewing and editing.

01

02

03

From top: geojson.io interface, geojson.io Gist, Mapbox integration

geojson.io proved especially useful for converting data into a web-ready format for integration into an external library, such as Mapbox or Leaflet.js. Thank you to everyone who attended, and look forward to seeing you next Friday!

By the way, Map Club has a mailing list! Sign up here if you would like to receive updates on future sessions. For this session’s resources and materials, visit the Map Club Github repository.

Map Club — Dynamic Mapping with Cartagen

20160901_banner_fall_v1

Map Club commenced its first meeting of Fall 2016 by experimenting with Cartagen, a vector-based framework for rendering maps in HTML5. Cartagen was originally developed by a research team at the MIT Center for Civic Media.

One goal of Map Club is to explore the less populous corners of GIS, legacy projects included. Though Cartagen has stood the test of time, its documentation has not. Tracking down its functional source code thus proved to be a challenging endeavor. Luckily, attendees were up to the job (thanks, Mikey!), and after clearing the gridded debugging screen, were able to produce some interesting visual results:

01

02

rachael

shaky

From top: Debugger grid, Emily, Rachael, Shaky

Next week we will focus on the much more recently-created geojson.io, a simple, open-source editor for map data.

For this session’s resources and materials, visit the Map Club Github repository.

Map Club! (Fall 2016 Edition)

20160901_banner_fall_v1

Join us for Map Club! A series of fast-paced hack sessions geared towards the rapid acquisition of skills in geospatial technology. 

Led by DSSC Spatial Research Intern, Emily Fuhrman, each session provides an informal and fun opportunity for the exploration of a web-based library or framework. Sessions will be loosely divided into three phases: background and setup, self-paced making, and sharing.

These sessions will be held in Room 215 on the lower level of Lehman Library. Please bring your own laptop. Participants should have basic facility with JavaScript.

RSVP through the library workshop page, and for any questions, please feel free to contact (dssc@library.columbia.edu)

09/23, 1:30 – 3:00PM → Dynamic Mapping with Cartagen

This session focuses on Cartagen, a vector-based framework for rendering maps in HTML5.

09/30, 1:30 – 3:00PM → Simple Maps with geojson.io

This session focuses on geojson.io, a simple, open-source editor for map data.

10/07, 1:30 – 3:00PM → WORKSHOP — Interactive maps with CARTO

This guided session explores CARTO, a unified web mapping and visualization engine.

10/14, 1:30 – 3:00PM → Interactive Mapping with Mapzen

This session focuses on Mapzen, an open, sustainable, and accessible mapping platform.

10/28, 1:30 – 3:00PM → Dynamic Mapping with OpenLayers

This session focuses on OpenLayers, a high-performance library for rendering geographic information in web pages.

11/04, 1:30 – 3:00PM → WORKSHOP — Introduction to QGIS

This guided session explores QGIS, a free and open source geographic information system that offers powerful tools for data editing, viewing, and analysis.

11/11, 1:30 – 3:00PM → Generating Cartograms with CartoGrid

This session focuses on CartoGrid, a grid-based cartogram generator.

11/18, 1:30 – 3:00PM → Geospatial Analysis with Turf.js

This session focuses on Turf.js, a tool for in-browser geospatial analysis.

12/02, 1:30 – 3:00PM → WORKSHOP — D3.js

This guided session explores the geovisualization capabilities of D3.js, a JavaScript library for manipulating documents based on data.

Hope to see you there!