Skip to content

Instantly share code, notes, and snippets.

View tomgp's full-sized avatar
🚲

Tom Pearson tomgp

🚲
45 followers · 14 following
View GitHub Profile
@tomgp
tomgp / package.json
Last active February 16, 2024 22:08
Server side SVG via D3 & jsdom
{
"name": "simple-node-d3",
"version": "1.0.0",
"description": "Serverside SVG via D3 & jsdom",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "tom.g.pearson@gmail.com",
"license": "ISC",
@tomgp
tomgp / index.html
Last active January 23, 2024 07:04
Screensize vs Browser size
<html>
<head>
<title>Screen Resolution &ne; Browser Window</title>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<link rel="stylesheet" type="text/css" href="http://www.toffeemilkshake.co.uk/tgp-ui-styles/ui-style.css">
<style type="text/css">
.view{
fill:none;
stroke:#000;
stroke-width:3px;
@tomgp
tomgp / index.html
Last active August 14, 2023 14:12
topojson neighborhoods
<!DOCTYPE html>
<meta charset="utf-8">
<title>topojson neighbourhood</title>
<style>
body{
font-family: sans-serif;
}
svg{
border:1px solid #000;
@tomgp
tomgp / index.html
Last active April 19, 2023 21:16
drag circles around in a ring
<html>
<head>
<title>ring control</title>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<style type="text/css">
.handle{
fill:#FFF;
stroke:#000;
stroke-width:4;
cursor: all-scroll;
@tomgp
tomgp / index.html
Last active October 7, 2022 01:37
2d Slider
<html>
<head>
<style>
body{
font-family: sans-serif;
}
svg{
border: 1px solid black;
cursor: move;
@tomgp
tomgp / index.html
Created November 14, 2017 11:00
canvas kaleidoscope
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>kaleidoscope</title>
<style>
@tomgp
tomgp / index.html
Last active August 6, 2022 22:07
evenly distribute points on a circle
<html>
<head>
<title>Points evenly spaced on a circle</title>
<script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script>
<style type="text/css">
.guide{
stroke:#000;
fill:none;
stroke-width:5;
stroke-dasharray:5, 5;
@tomgp
tomgp / index.html
Created April 30, 2021 07:49
grouped bars
<script src="https://d3js.org/d3.v6.min.js"></script>
<style>
svg{border:1px solid black;}
*{font-family: sans-serif;}
</style>
<body>
<svg width="500" height="500">
</svg>
<p>Example of grouped bars where each group has a different number of members</p>
<p>A response to this question on Stack Overflow: <a href="">d3js grouped bar chart, is this possible?</a></p>
@tomgp
tomgp / Periodic Table of Elements.csv
Created October 14, 2020 07:15 — forked from GoodmanSciences/Periodic Table of Elements.csv
We can make this file beautiful and searchable if this error is corrected: It looks like row 7 should actually have 28 columns, instead of 24. in line 6.
AtomicNumber,Element,Symbol,AtomicMass,NumberofNeutrons,NumberofProtons,NumberofElectrons,Period,Group,Phase,Radioactive,Natural,Metal,Nonmetal,Metalloid,Type,AtomicRadius,Electronegativity,FirstIonization,Density,MeltingPoint,BoilingPoint,NumberOfIsotopes,Discoverer,Year,SpecificHeat,NumberofShells,NumberofValence
1,Hydrogen,H,1.007,0,1,1,1,1,gas,,yes,,yes,,Nonmetal,0.79,2.2,13.5984,8.99E-05,14.175,20.28,3,Cavendish,1766,14.304,1,1
2,Helium,He,4.002,2,2,2,1,18,gas,,yes,,yes,,Noble Gas,0.49,,24.5874,1.79E-04,,4.22,5,Janssen,1868,5.193,1,
3,Lithium,Li,6.941,4,3,3,2,1,solid,,yes,yes,,,Alkali Metal,2.1,0.98,5.3917,5.34E-01,453.85,1615,5,Arfvedson,1817,3.582,2,1
4,Beryllium,Be,9.012,5,4,4,2,2,solid,,yes,yes,,,Alkaline Earth Metal,1.4,1.57,9.3227,1.85E+00,1560.15,2742,6,Vaulquelin,1798,1.825,2,2
5,Boron,B,10.811,6,5,5,2,13,solid,,yes,,,yes,Metalloid,1.2,2.04,8.298,2.34E+00,2573.15,4200,6,Gay-Lussac,1808,1.026,2,3
6,Carbon,C,12.011,6,6,6,2,14,solid,,yes,,yes,,Nonmetal,0.91,2.55,11.2603,2.27E+00,3948.15,4300,7,Prehi
@tomgp
tomgp / TheEnormousSpace.md
Last active April 2, 2020 22:36