README is empty
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<title>Collapsible Tree Example</title> | |
<style> | |
.node circle { |
What do you know about vacant houses? Baltimore City has over 16,000 vacant homes that contribute to a wide range of challenges for Baltimore residents and neighborhoods. Are they "eyesores" that all need to be torn down? Or historic buildings with potential for reuse? Bring your questions and ideas to a free workshop on vacant housing in Baltimore dedicated to exploring this important issue facing Baltimore's historic neighborhoods.
This gist is a place to share data we are gathering for the workshop and experiment with visualizations using bl.ocks.org, D3 and related tools.
Here are the tables I have transcribed and am using for visualizations/analysis:
A simple stacked coloumn graph built using d3's stack layout.
The SVG tooltip is based on this gist by Mike Bostock. In short, the tooltip's group, comprised of a rect and a text element, are created when the chart is first drawn and set to be hidden. Action is applied to the stacks' rects: on mouseover the group become visible; on mousemove the mouse's XY position is captured and used to transform/translate the group.
If you ajust the tooltip's XY offset, keep in mind that there can be no overlap between the group and the mouse's position or the group's visibility will remain hidden.
<!doctype html> | |
<html class="no-js" lang=""> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="x-ua-compatible" content="ie=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>Freedom House Timeline | Baltimore Heritage</title> | |
<meta name="description" content="A timeline made with Tik Tok." /> |
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset=utf-8 /> | |
<title>Tour Map · Confederate Monuments in Wyman Park Dell and Charles Village</title> | |
<meta name='viewport' content='initial-scale=1,maximum-scale=1,user-scalable=no' /> | |
<script src='https://api.mapbox.com/mapbox.js/v2.2.1/mapbox.js'></script> | |
<link href='https://api.mapbox.com/mapbox.js/v2.2.1/mapbox.css' rel='stylesheet' /> | |
<style> | |
body { margin:0; padding:0; } |
<!doctype html> | |
<html class="no-js" lang=""> | |
<head> | |
<meta charset="utf-8"> | |
<meta http-equiv="x-ua-compatible" content="ie=edge"> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<title>Tabletop example | Tik Tok examples</title> | |
<meta name="description" content="Tik Tok is a Javascript tool to easily create beautiful, simple, mobile-friendly, vertical timelines." /> |
{ | |
"sample": { | |
"themes": [ | |
{ | |
"location": "automattic/_s", | |
"activate": true | |
} | |
], | |
"mu_plugins": [ |