Skip to content

Instantly share code, notes, and snippets.

View mxfh's full-sized avatar

Friedrich Hartmann mxfh

View GitHub Profile
@mxfh
mxfh / british_isles.json
Created August 10, 2018 01:43
British Isles from Natural Earth as TopoJSON
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
@mxfh
mxfh / d3map.css
Last active November 1, 2016 11:25 — forked from emeeks/d3map.css
Stamen Tiles - d3.carto.map
path,circle,rect,polygon,ellipse,line {
vector-effect: non-scaling-stroke;
}
svg, canvas {
top: 0;
}
#d3MapZoomBox {
position: absolute;
z-index: 10;
height: 100px;
@mxfh
mxfh / circle-legend.js
Last active December 16, 2015 03:14 — forked from aubergene/circle-legend.js
D3 Circular Legend
// Adapted from https://github.com/mbostock/d3/blob/master/src/svg/axis.js
// forked from http://bl.ocks.org/aubergene/4723857
var circleLegend = function() {
'use strict';
var scale,
orient = 'left',
tickPadding = 3,
tickExtend = 5,
tickArguments_ = [10],
@mxfh
mxfh / README.md
Last active September 9, 2015 12:56 — forked from mbostock/.block
Azimuthal Equidistant
@mxfh
mxfh / index.html
Last active August 29, 2015 14:09 — forked from mbostock/.block
Orthographic to Azimuthal Equidistant Projection
<!DOCTYPE html>
<meta charset="utf-8">
<style>
path {
fill: none;
stroke-linejoin: round;
}
.sphere,
@mxfh
mxfh / README.md
Last active August 29, 2015 14:07
... in a Million

Rendering a SVG Chart for showing parts of a whole.

Supported URL query string parameters

  • 'count'
  • 'total' (rounds up to next number with integer root)
  • 'boxsize'
  • 'size' (output size of SVG)
  • 'padding' (between boxes)
  • 'outerPadding' (between outline and):
  • 'outline' (width, in units of output size)
@mxfh
mxfh / index.html
Last active December 18, 2015 21:48
Gendertrouble
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Gendertrouble</title>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<style>
circle.rillenfeld {fill: #16161D;}
circle.label {fill: none; stroke: #A04D32; stroke-width: 1;}
svg text {fill: white; font-family: sans-serif; font-weight: normal;}
@mxfh
mxfh / colorhelpersforcanvas.js
Last active December 12, 2015 05:08
color-string to color-string-with-alpha conversion: works with any common CSS-defined color format including: rgba, rgb, r%g%b%, #rgb, #rrggbb, hsl, hsla mostly useful in drawing with alpha/opacity/transparency onto a HTML5 canvas element with passed on color strings
"use strict";
String.prototype.colorNameToHex = function (returnUnresolved) { // color list from http://stackoverflow.com/q/1573053/731179 with added gray/gray
var hexRGB, definedColorNames = {"aliceblue": "#f0f8ff", "antiquewhite": "#faebd7", "aqua": "#00ffff", "aquamarine": "#7fffd4", "azure": "#f0ffff", "beige": "#f5f5dc", "bisque": "#ffe4c4", "black": "#000000", "blanchedalmond": "#ffebcd", "blue": "#0000ff", "blueviolet": "#8a2be2", "brown": "#a52a2a", "burlywood": "#deb887", "cadetblue": "#5f9ea0", "chartreuse": "#7fff00", "chocolate": "#d2691e", "coral": "#ff7f50", "cornflowerblue": "#6495ed", "cornsilk": "#fff8dc", "crimson": "#dc143c", "cyan": "#00ffff", "darkblue": "#00008b", "darkcyan": "#008b8b", "darkgoldenrod": "#b8860b", "darkgray": "#a9a9a9", "darkgreen": "#006400", "darkkhaki": "#bdb76b", "darkmagenta": "#8b008b", "darkolivegreen": "#556b2f", "darkorange": "#ff8c00", "darkorchid": "#9932cc", "darkred": "#8b0000", "darksalmon": "#e9967a", "darkseagreen": "#8fbc8f", "darkslateblue": "#483d8b"
@mxfh
mxfh / _.md
Last active December 11, 2015 23:48
simple overlayed globe canvas