Skip to content

Instantly share code, notes, and snippets.

@mbostock
Last active February 9, 2016 02:01
Show Gist options
  • Save mbostock/6409154 to your computer and use it in GitHub Desktop.
Save mbostock/6409154 to your computer and use it in GitHub Desktop.
Simple Junctions
license: gpl-3.0
<!DOCTYPE html>
<meta charset="utf-8">
<style>
text {
font: 11px sans-serif;
text-anchor: middle;
}
circle {
fill: black;
stroke: white;
}
path {
fill: none;
stroke: #333;
stroke-width: .5px;
stroke-linejoin: round;
}
</style>
<svg width="960" height="300">
<g transform="translate(210,120)">
<path d="M-60,-30L0,0L60,-30"/>
<path d="M-60,30L0,0L60,30"/>
<g transform="translate(-60,-30)"><text y="-8">A</text><circle r="3.5"/></g>
<g><text y="-8">B</text><circle r="3.5"/></g>
<g transform="translate(60,-30)"><text y="-8">C</text><circle r="3.5"/></g>
<g transform="translate(-60,30)"><text y="-8">D</text><circle r="3.5"/></g>
<g transform="translate(60,30)"><text y="-8">E</text><circle r="3.5"/></g>
</g>
<g transform="translate(480,120)">
<path d="M-60,0L0,0L60,-30"/>
<path d="M-60,0L0,0L60,30"/>
<g transform="translate(-60,0)"><text y="-8">A</text><circle r="3.5"/></g>
<g><text y="-8">B</text><circle r="3.5"/></g>
<g transform="translate(60,-30)"><text y="-8">C</text><circle r="3.5"/></g>
<g transform="translate(60,30)"><text y="-8">D</text><circle r="3.5"/></g>
</g>
<g transform="translate(750,120)">
<path d="M-60,-30L0,0L60,0"/>
<path d="M-60,30L0,0L60,0"/>
<g transform="translate(-60,-30)"><text y="-8">A</text><circle r="3.5"/></g>
<g transform="translate(-60,30)"><text y="-8">D</text><circle r="3.5"/></g>
<g><text y="-8">B</text><circle r="3.5"/></g>
<g transform="translate(60,0)"><text y="-8">C</text><circle r="3.5"/></g>
</g>
</svg>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment