darosh/README.md

## README.md

      
    Raw
  

              README.md
            
          
    Hexakis icosahedron for Planetary Grid.

  
## hexakis-icosahedron.js
d3.geo.hexakisIcosahedron = (function () {
    'use strict';

    var Y = Math.atan2(1, 2) * 180 / Math.PI;
    var I = d3.geo.interpolate([0, Y], [72, Y])(0.5);

    var Y4 = (90 + Y) / 2;
    var Y3 = d3.geo.interpolate(I, [36, 90])(0.36)[1];
    var Y2 = I[1];
    var Y0 = d3.geo.interpolate(I, [36, -Y])(0.36)[1];

    function icosahedronPoints() {
        var points = [];

        points.push([0, -90]);

        for (var x = 0; x < 360; x += 72) {
            points.push([x, -Y], [x + 36, Y]);
        }

        points.push([0, 90]);

        return {type: 'MultiPoint', coordinates: points};
    }

    function hexakisCenterPoints() {
        var points = [];

        for (var x = 0; x < 360; x += 72) {
            points.push(
                [x + 36, -Y3],
                [x, Y0],
                [x + 72, Y3],
                [x + 72 + 36, -Y0]
            );
        }

        return {type: 'MultiPoint', coordinates: points};
    }

    function hexakisCrossPoints() {
        var points = [];

        for (var x = 0; x < 360; x += 72) {
            points.push(
                [x, -Y4],
                [x, Y2],
                [x + 18, 0],
                [x + 36, Y4],
                [x + 36, -Y2],
                [x + 36 + 18, 0]
            );
        }

        return {type: 'MultiPoint', coordinates: points};
    }

    function icosahedronEdges() {
        var edges = [];

        for (var x = 0; x < 360; x += 72) {
            edges.push([[x, -90], [x, -Y]]);
            edges.push([[x, -Y], [x + 72, -Y]]);
            edges.push([[x + 36, Y], [x - 36, Y]]);
            edges.push([[x + 36, Y], [x, -Y]]);
            edges.push([[x - 36, Y], [x, -Y]]);
            edges.push([[x + 36, 90], [x + 36, Y]]);
        }

        return {type: 'MultiLineString', coordinates: edges};
    }

    function hexakisCenterEdges() {
        var edges = [];

        for (var x = 0; x < 360; x += 72) {
            edges.push([[x, -90], [x + 36, -Y3]]);
            edges.push([[x, -Y], [x + 36, -Y3]]);
            edges.push([[x + 72, -Y], [x + 36, -Y3]]);
            edges.push([[x + 36, Y], [x + 36, -Y0]]);
            edges.push([[x, -Y], [x + 36, -Y0]]);
            edges.push([[x + 72, -Y], [x + 36, -Y0]]);
            edges.push([[x + 36, Y], [x, Y0]]);
            edges.push([[x - 36, Y], [x, Y0]]);
            edges.push([[x, -Y], [x, Y0]]);
            edges.push([[x, 90], [x, Y3]]);
            edges.push([[x + 36, Y], [x, Y3]]);
            edges.push([[x - 36, Y], [x, Y3]]);
        }

        return {type: 'MultiLineString', coordinates: edges};
    }


    function hexakisSideEdges() {
        var edges = [];

        for (var x = 0; x < 360; x += 72) {
            edges.push([[x, Y3], [x, Y0]]);
            edges.push([[x - 36, -Y0], [x, Y0]]);
            edges.push([[x + 36, -Y0], [x, Y0]]);
            edges.push([[x + 36, -Y0], [x + 36, -Y3]]);
            edges.push([[x - 36, -Y3], [x + 36, -Y3]]);
            edges.push([[x, Y3], [x + 72, Y3]]);
        }

        return {type: 'MultiLineString', coordinates: edges};
    }

    return {
        icosahedronPoints: icosahedronPoints,
        icosahedronEdges: icosahedronEdges,
        hexakisCenterPoints: hexakisCenterPoints,
        hexakisCenterEdges: hexakisCenterEdges,
        hexakisCrossPoints: hexakisCrossPoints,
        hexakisSideEdges: hexakisSideEdges
    };
})();

## index.html
<!DOCTYPE html>
<meta charset="utf-8">
<style>
    .cool-point {
        fill: none;
        stroke: #33e;
        stroke-width: 1.5;
        stroke-opacity: 0.33;
    }

    .hot-point {
        fill: none;
        stroke: #f33;
        stroke-width: 1.5;
        stroke-opacity: 0.33;
    }

    .balance-point {
        fill: none;
        stroke: #333;
        stroke-width: 1;
        stroke-opacity: 0.33;
    }

    .graticule {
        fill: none;
        stroke: #333;
        stroke-width: 0.125;
        stroke-opacity: 0.66;
    }

    .cool-edge {
        fill: none;
        stroke: #33e;
        stroke-width: 5;
        stroke-opacity: .25;
    }

    .hot-edge {
        fill: none;
        stroke: #f33;
        stroke-width: 4;
        stroke-opacity: .25;
    }

    .balance-edge {
        fill: none;
        stroke: #333;
        stroke-width: 4;
        stroke-opacity: .25;
    }
</style>
<body>
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
<script src="hexakis-icosahedron.js"></script>
<script>
    var width = 960, height = 500;

    var projectionLines = d3.geo
            .orthographic()
            .translate([width / 2, height / 2])
            .scale(245);

    var pathLines = d3.geo.path()
            .projection(projectionLines);

    var svg = d3.select('body').append('svg').attr('width', width).attr('height', height);

    var h = d3.geo.hexakisIcosahedron;
    var ce = svg.append('path').datum(h.icosahedronEdges).attr('class', 'cool-edge').attr('d', pathLines);
    var he = svg.append('path').datum(h.hexakisCenterEdges).attr('class', 'hot-edge').attr('d', pathLines);
    var be = svg.append('path').datum(h.hexakisSideEdges).attr('class', 'balance-edge').attr('d', pathLines);
    var cp = svg.append('path').datum(h.icosahedronPoints).attr('class', 'cool-point').attr('d', pathLines);
    var hp = svg.append('path').datum(h.hexakisCenterPoints).attr('class', 'hot-point').attr('d', pathLines);
    var bp = svg.append('path').datum(h.hexakisCrossPoints).attr('class', 'balance-point').attr('d', pathLines);

    d3.timer(function (elapsed) {
        projectionLines.rotate([elapsed * 0.02, elapsed * 0.01, 0]);

        ce.attr('d', pathLines);
        he.attr('d', pathLines);
        be.attr('d', pathLines);
        cp.attr('d', pathLines);
        hp.attr('d', pathLines);
        bp.attr('d', pathLines);
    });
</script>

## thumbnail.png

      
    Raw
  

              thumbnail.png
	d3.geo.hexakisIcosahedron = (function () {
	'use strict';

	var Y = Math.atan2(1, 2) * 180 / Math.PI;
	var I = d3.geo.interpolate([0, Y], [72, Y])(0.5);

	var Y4 = (90 + Y) / 2;
	var Y3 = d3.geo.interpolate(I, [36, 90])(0.36)[1];
	var Y2 = I[1];
	var Y0 = d3.geo.interpolate(I, [36, -Y])(0.36)[1];

	function icosahedronPoints() {
	var points = [];

	points.push([0, -90]);

	for (var x = 0; x < 360; x += 72) {
	points.push([x, -Y], [x + 36, Y]);
	}

	points.push([0, 90]);

	return {type: 'MultiPoint', coordinates: points};
	}

	function hexakisCenterPoints() {
	var points = [];

	for (var x = 0; x < 360; x += 72) {
	points.push(
	[x + 36, -Y3],
	[x, Y0],
	[x + 72, Y3],
	[x + 72 + 36, -Y0]
	);
	}

	return {type: 'MultiPoint', coordinates: points};
	}

	function hexakisCrossPoints() {
	var points = [];

	for (var x = 0; x < 360; x += 72) {
	points.push(
	[x, -Y4],
	[x, Y2],
	[x + 18, 0],
	[x + 36, Y4],
	[x + 36, -Y2],
	[x + 36 + 18, 0]
	);
	}

	return {type: 'MultiPoint', coordinates: points};
	}

	function icosahedronEdges() {
	var edges = [];

	for (var x = 0; x < 360; x += 72) {
	edges.push([[x, -90], [x, -Y]]);
	edges.push([[x, -Y], [x + 72, -Y]]);
	edges.push([[x + 36, Y], [x - 36, Y]]);
	edges.push([[x + 36, Y], [x, -Y]]);
	edges.push([[x - 36, Y], [x, -Y]]);
	edges.push([[x + 36, 90], [x + 36, Y]]);
	}

	return {type: 'MultiLineString', coordinates: edges};
	}

	function hexakisCenterEdges() {
	var edges = [];

	for (var x = 0; x < 360; x += 72) {
	edges.push([[x, -90], [x + 36, -Y3]]);
	edges.push([[x, -Y], [x + 36, -Y3]]);
	edges.push([[x + 72, -Y], [x + 36, -Y3]]);
	edges.push([[x + 36, Y], [x + 36, -Y0]]);
	edges.push([[x, -Y], [x + 36, -Y0]]);
	edges.push([[x + 72, -Y], [x + 36, -Y0]]);
	edges.push([[x + 36, Y], [x, Y0]]);
	edges.push([[x - 36, Y], [x, Y0]]);
	edges.push([[x, -Y], [x, Y0]]);
	edges.push([[x, 90], [x, Y3]]);
	edges.push([[x + 36, Y], [x, Y3]]);
	edges.push([[x - 36, Y], [x, Y3]]);
	}

	return {type: 'MultiLineString', coordinates: edges};
	}


	function hexakisSideEdges() {
	var edges = [];

	for (var x = 0; x < 360; x += 72) {
	edges.push([[x, Y3], [x, Y0]]);
	edges.push([[x - 36, -Y0], [x, Y0]]);
	edges.push([[x + 36, -Y0], [x, Y0]]);
	edges.push([[x + 36, -Y0], [x + 36, -Y3]]);
	edges.push([[x - 36, -Y3], [x + 36, -Y3]]);
	edges.push([[x, Y3], [x + 72, Y3]]);
	}

	return {type: 'MultiLineString', coordinates: edges};
	}

	return {
	icosahedronPoints: icosahedronPoints,
	icosahedronEdges: icosahedronEdges,
	hexakisCenterPoints: hexakisCenterPoints,
	hexakisCenterEdges: hexakisCenterEdges,
	hexakisCrossPoints: hexakisCrossPoints,
	hexakisSideEdges: hexakisSideEdges
	};
	})();
	<!DOCTYPE html>
	<meta charset="utf-8">
	<style>
	.cool-point {
	fill: none;
	stroke: #33e;
	stroke-width: 1.5;
	stroke-opacity: 0.33;
	}

	.hot-point {
	fill: none;
	stroke: #f33;
	stroke-width: 1.5;
	stroke-opacity: 0.33;
	}

	.balance-point {
	fill: none;
	stroke: #333;
	stroke-width: 1;
	stroke-opacity: 0.33;
	}

	.graticule {
	fill: none;
	stroke: #333;
	stroke-width: 0.125;
	stroke-opacity: 0.66;
	}

	.cool-edge {
	fill: none;
	stroke: #33e;
	stroke-width: 5;
	stroke-opacity: .25;
	}

	.hot-edge {
	fill: none;
	stroke: #f33;
	stroke-width: 4;
	stroke-opacity: .25;
	}

	.balance-edge {
	fill: none;
	stroke: #333;
	stroke-width: 4;
	stroke-opacity: .25;
	}
	</style>
	<body>
	<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
	<script src="hexakis-icosahedron.js"></script>
	<script>
	var width = 960, height = 500;

	var projectionLines = d3.geo
	.orthographic()
	.translate([width / 2, height / 2])
	.scale(245);

	var pathLines = d3.geo.path()
	.projection(projectionLines);

	var svg = d3.select('body').append('svg').attr('width', width).attr('height', height);

	var h = d3.geo.hexakisIcosahedron;
	var ce = svg.append('path').datum(h.icosahedronEdges).attr('class', 'cool-edge').attr('d', pathLines);
	var he = svg.append('path').datum(h.hexakisCenterEdges).attr('class', 'hot-edge').attr('d', pathLines);
	var be = svg.append('path').datum(h.hexakisSideEdges).attr('class', 'balance-edge').attr('d', pathLines);
	var cp = svg.append('path').datum(h.icosahedronPoints).attr('class', 'cool-point').attr('d', pathLines);
	var hp = svg.append('path').datum(h.hexakisCenterPoints).attr('class', 'hot-point').attr('d', pathLines);
	var bp = svg.append('path').datum(h.hexakisCrossPoints).attr('class', 'balance-point').attr('d', pathLines);

	d3.timer(function (elapsed) {
	projectionLines.rotate([elapsed * 0.02, elapsed * 0.01, 0]);

	ce.attr('d', pathLines);
	he.attr('d', pathLines);
	be.attr('d', pathLines);
	cp.attr('d', pathLines);
	hp.attr('d', pathLines);
	bp.attr('d', pathLines);
	});
	</script>