Skip to content

Instantly share code, notes, and snippets.

@danharr

danharr/index.html

Last active August 29, 2015 13:57
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save danharr/9837364 to your computer and use it in GitHub Desktop.
Save danharr/9837364 to your computer and use it in GitHub Desktop.
Download ZIP
BrainViz
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>quick brain demo</title>
<script src="http://mbostock.github.com/d3/d3.v2.js"></script>
</head>
<body>
<script>
var vis = d3.select("body").append("svg").attr("width",1000).attr("height",700)
var xscale = d3.scale.linear()
.domain([0, 2])
.range([10, 750]);
var yscale = d3.scale.linear()
.domain([51, 52])
.range([690, 10]);
var xscale2 = d3.scale.linear()
.domain([0, 2])
.range([10, 1500]);
var yscale2 = d3.scale.linear()
.domain([51, 52])
.range([1380, 10]);
//This is the accessor function we talked about above
var lineFunction = d3.svg.line()
.x(function(d) { return xscale(d.x); })
.y(function(d) { return yscale(d.y); })
.interpolate("linear");
vis.append("path")
.attr("d", "M179.355,343.904c-10.077-2.866-21.94-1.063-34.984,3.801 c-18.508,6.902-36.351-4.063-53.9-9.366c-31.396-9.486-52.283-33.535-71.618-57.789C6.871,265.516,0.266,246.924,3.442,226.027 c1.383-9.101-1.152-18.807-2.039-28.227c-0.152-1.62-1.659-3.323-1.365-4.745c3.983-19.36,3.722-39.736,12.167-57.944 c2.24-4.83,1.177-10.198,3.774-13.989c10.593-15.457,15.094-33.767,24.101-50.147c9.865-17.941,25.539-28.315,39.635-39.533 c16.964-13.501,36.466-28.919,61.97-20.011c4.675,1.633,6.89-0.758,9.215-4.022c4.003-5.619,10.395-9.011,16.262-6.648 c13.246,5.332,26.941,11.17,40.056,14.969c22.085,6.396,33.049,23.9,48.77,36.613c6.882,5.565,11.055,12.525,14.832,20.857 c7.817,17.24,13.72,35.36,19.856,52.931c6.763,19.353,14.766,40.079,10.542,61.94c-0.521,2.688-0.543,4.905,1.152,6.982 c7.95,9.745,6.276,20.741,2.336,30.864c-10.762,27.647-18.394,56.744-36.2,81.284c-2.725,3.757-5.172,7.905-9.772,9.278 c-16.109,4.803-29.558,14.941-44.619,21.782C204.154,342.788,193.297,343.955,179.355,343.904z")
.attr("stroke-width", 1)
.attr("fill", "black")
.attr("transform", "translate(400,100)")
vis.append("path")
.attr("d",
"M296.197,172.911c2.533,11.409,0.278,19.617-8.614,25.349 c-3.664,2.365-5.528,5.768-7.236,9.762c-6.337,14.824-28.39,22.305-42.643,14.932c-8.118-4.201,3.479-4.688,0.877-8.389 c-7.81,0.063-14.423,3.635-20.099,9.252c-8.04,7.956-17.367,14.25-26.357,21.012c-7.583,5.707-15.64,6.078-23.528,2.341 c-8.289-3.929-9.225-12.558-9.115-20.434c0.151-11.057,3.689-21.259,11.15-29.8c2.941-3.369,5.775-6.826,9.207-10.894 c-15.923,2.59-20.216-0.726-22.277-15.705c-2.274-16.49,3.093-29.455,17.86-38.274c-3.744-3.576-6.867-1.142-9.02,0.509 c-9.921,7.606-10.868,0.834-11.489-6.796c-0.098-1.244-0.337-2.576-0.026-3.738c2.904-10.895,3.926-20.926-1.889-32.066 c-4.284-8.213,1.067-16.544,10.131-21.073c-14.516,3.142-20.82,12.892-18.641,28.069c0.59,4.112,1.973,8.115,2.471,12.231 c1.511,12.469-1.318,15.399-13.873,16.039c-8.569,0.436-17.478,0.368-24.503,7.447c8.074,0,15.629-0.501,23.091,0.115 c11.591,0.957,16.393,6.992,15.624,18.087c-0.773,11.143-6.738,15.332-17.559,13.919c-5.8-0.758-11.645-0.407-17.354,1.215 c-11.821,3.359-22.657,0.445-28.195-10.104c-5.442-10.363-4.296-21.904,4.734-31.167c1.423-1.459,2.814-2.948,4.499-4.717 c-12.523-0.975-16.252-7.49-11.384-18.389c3.917-8.771,13.083-12.597,19.275-21.107c-9.437-1.07-12.121-7.126-11.915-15.214 c0.229-9.001,6.496-12.966,13.505-16.23c4.046-1.883,10.878,0.275,8.339-9.269c-1.103-4.146,7.386-5.286,11.706-7.526 c2.695-1.397,5.381-3.663,3.228-6.858c-2.188-3.248-4.112,0.081-6.018,1.267c-4.487,2.795-10.124,2.793-14.372,7.539 c-3.587-13.864,7.078-13.27,13.427-16.31c8.33-3.988,16.178-2.714,23.199,3.33c0.304,0.263,0.703,0.954,0.699,0.958 c-12.54,9.234,12.915,17.875,0.49,28.29c-2.085,1.747,6.579,9.266,6.315,16.226c7.312-6.804,13.241-12.321,19.485-18.132 c-15.466,1.439-17.416-1.627-11.284-16.454c1.251-3.017,5.844-6.558,0.772-9.42c-5.621-3.174-5.436-6.844-2.512-11.236 c3.325-4.996,8.614-8.186,13.891-4.972c9.323,5.675,19.398,8.636,29.563,12.023c6.896,2.297,9.036,7.899,1.072,13.411 c6.679,3.312,17.609,6.453,14.909,13.003c-3.476,8.43,2.048,12.299,2.744,18.207c1.08,9.16,5.535,12.139,13.441,14.262 c8.692,2.335,11.12,10.472,13.536,18.149c2.427,7.703-5.309,5.493-8.689,8.784c8.707,5.648,18.164,4.71,30.558,6.229 c-8.941-6.57-16.693-11.04-13.285-22.118c5.47,6.042,11.213,11.038,17.633,15.362c4.828,3.252,8.604,8.615,5.98,15.007 c-2.496,6.081-8.276,5.796-13.93,5.495c-13.627-0.724-28.119,6.834-32.494,16.523c-0.851,1.884-2.323,3.762-0.098,5.511 c2.276,1.789,3.911,0.016,5.182-1.559c9.449-11.707,20.091-19.008,35.499-10.337c1.933,1.087,4.126,0.957,5.162-1.505 c1.231-2.919,1.458-7.327,5.993-6.009c1.585,0.462,2.743,3.988,3.222,6.297c0.836,4.031-1.065,7.27-4.307,9.708 c-0.33,0.248-0.691,0.628-1.048,0.64c-18.348,0.619-32.658,11.363-48.196,19.066c-4.271,2.117-8.907,2.889-12.859-0.721 c-4.056-3.708-3.44-8.583-1.366-12.738c6.892-13.807,3.794-25.837-5.875-36.782c-7.603-8.603-3.978-12.883,5.294-15.918 c3.039-0.994,9.186-1.019,6.945-6.317c-1.729-4.081-5.902-0.417-8.611,0.802c-5.852,2.631-8.603-0.376-10.49-5.157 c-1.065-2.702-3.018-5.93-2.353-8.3c5.849-20.88-11.092-33.842-17.502-52.09c-3.621,10.514,0.122,18.015,5.57,24.663 c2.403,2.932,5.77,5.11,4.925,9.357c-3.127,15.733,0.164,31.311,6.352,44.909c8.126,17.859,14.81,34.138,6.904,54.107 c-2.147,5.428,6.308,12.473,4.856,20.916c-1.065,6.212-2.57,10.321-7.793,14.226c-10.495,7.842-17.39,18.229-18.024,32.775 c4.842-2.272,4.988-6.481,6.906-9.479c8.24-12.884,19.575-24.647,34.788-23.047c23.644,2.487,40.786-11.196,60.589-18.342 C292.481,174.997,293.859,174.099,296.197,172.911z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "green")
vis.append("path")
.attr("d",
"M16.661,234.68c16.065-5.787,28.855,2.692,34.26,13.632 c4.834,9.787,2.125,19.329,12.739,3.758c1.894-2.78,7.642-0.635,9.686,2.814c9.883,16.676,25.583,22.529,43.51,23.418 c2.155-10.976-3.599-10.793-13.291-9.786c-13.389,1.39-25.482-13.441-24.263-27c0.312-3.454,2.833-8.561-1.665-9.906 c-4.786-1.435-3.839,4.321-4.727,6.999c-2.69,8.101-8.252,6.953-13.994,4.684c-8.812-3.484-13.06-11.128-16.633-19.264 c-1.389-3.161-1.411-7.236-6.811-9.843c0.959,14.533-6.878,13.854-16.206,10.962c-7.328-2.272-9.317-8.102-9.232-14.517 c0.097-7.229,6.488-4.856,10.506-5.382c12.128-1.58,23.769-7.693,36.674-2.426c5.771,2.351,9.85,3.654,4.455,11.027 c19.305-6.01,24.073-4.082,33.212,12.56c5.591,10.181,12.947,17.873,24.547,21.646c11.74,3.818,18.534,15.701,31.126,19.531 c5.731,1.742,0.013,21.938-7.33,25.024c-13.626,5.729-26.707,4.683-38.869-4.171c-2.13-1.554-4.455-5.191-6.826-0.645 c-4.441,8.517-5.337,8.707-13.907,3.825c-4.977-2.833-7.769-7.23-10.318-12.01c-11.745,9.489-31.797,2.028-36.048-13.349 c-1.114-4.03,0.336-6.815-7.088-5.022c-9.598,2.321-12.224-8.609-18.571-18.342c12.425,7.188,22.572,10.759,35.239,9.903 C38.19,242.986,21.75,248.146,16.661,234.68z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "blue")
vis.append("path")
.attr("d",
"M43.76,174.221c17.829-21.058,22.331-21.551,42.22-7.473 c10.569,7.48,22.471,4.016,33.912,3.684c16.317-0.474,24.683,4.644,29.928,18.75c1.793,4.822,3.368,10.104,0.165,14.301 c-3.093,4.051-7.634-1.072-14.011,0.367c19.642,9.234,21.367,25.52,20.859,42.83c-0.309,10.446-6.34,15.059-13.859,8.155 c-13.158-12.088-33.521-14.492-41.189-34.627c-4.798-12.599-17.002-21.094-32.389-21.953c-15.078-0.846-29.728-6.103-45.265,0.581 c-9.574,4.122-17.116-2.564-18.262-12.781c-1.179-10.508,3.843-15.89,15.038-15.742c5.557,0.073,10.842-1.043,15.585-3.66 C42.249,163.478,45.128,164.354,43.76,174.221z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "yellow")
vis.append("path")
.attr("d",
"M74.027,75.959c-1.218-0.408-2.266-0.996-3.353-1.081 c-4.287-0.341-12.222,1.384-11.246-3.589c1.23-6.269-4.528-15.312,4.455-19.056c9.645-4.02,16.036-10.975,22.161-18.981 c2.391-3.125,8.509-7.76,11.329-4.102c2.557,3.316,5.134,10.439-1.403,15.322c-11.217,8.382-17.233,19.039-12.5,33.567 c1.329,4.078-0.683,6.741-3.513,9.764c-10.673,11.399-11.664,20.956-4.415,34.891c2.821,5.421,2.821,5.421-5.52,6.327 c-0.713,3.565,2.702,4.785,4.08,7.142c4.967,8.5,2.389,13.884-7.169,13.065c-13.536-1.161-23.605,7.011-35.086,11.373 c-5.488,2.085-10.931,2.383-15.198-1.699c-3.91-3.74-4.327-8.736-0.743-14.381c1.643,3.144,3.05,5.836,5.507,10.541 C24.588,139.39,35.066,140.705,45.7,141c-6.622-2.664-14.106-4.167-19.651-8.28c-7.253-5.382-3.077-13.628,0.25-19.042 c6.513-10.595,14.728-5.001,21.97,0.255c2.073-2.613,0.889-5.061,0.606-7.475c-1.519-12.957,2.643-19.119,15.233-22.163 C68.764,83.17,72.728,81.526,74.027,75.959z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "grey")
vis.append("path")
.attr("d",
"M264.643,273.475c-7.103,13.495-18.059,15.447-35.692,3.816 c6.127,18.625-5.937,26.619-18.533,33.342c-14.413,7.695-28.988,4.734-42.947-2.311c-1.393-0.704-3.45-2.463-3.313-3.475 c1.51-10.944-4.614-20.79-4.773-30.977c-0.137-8.663,4.075-17.629,16.833-16.896c9.056,0.523,16.526-4.419,23.032-10.808 c14.729-14.463,32.14-24.605,52.368-15.068c10.129,4.773,14.702-0.566,21.137-3.738c6.537-3.222,14.289-5.372,13.026-16.162 c-0.626-5.307,4.988-11.121,10.219-10.547c5.355,0.589,5.827,7.498,5.509,12.501c-0.752,11.746-6.801,21.176-14.228,29.795 c-8.543,9.913-18.704,17.78-30.968,22.505c-13.227,5.096-17.834,1.363-16.124-12.553c0.982-7.99-0.225-10.211-9.823-16.51 c1.64,8.858,6.787,17.16-0.643,24.592c-6.098,6.098-14.025,8.797-21.61,12.115c-8.722,3.813-17.492,7.487-24.948,14.626 C209.765,277.511,236.248,266.801,264.643,273.475z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "orange")
vis.append("path")
.attr("d",
"M155.75,292.682c-0.999,2.602-1.147,3.486-1.619,4.141 c-11.497,15.971-55.137,28.254-70.106,16.659c-12.645-9.797-25.677-15.799-40.362-20.971c-9.656-3.4-18.726-10.749-22.969-21.875 c5.496-1.52,8.98,1.241,12.005,4.857c6.461,7.725,14.908,11.873,24.601,13.632c8.493,1.539,17.255,2.208,23.046,10.006 c0.668,0.899,2.109,1.295,3.26,1.755C97.53,306.44,142.13,301.851,155.75,292.682z"
)
.attr("stroke-width", 1)
.attr("fill", "pink")
.attr("transform", "translate(400,100)")
.transition()
.duration(3000)
.attr("fill", "red")
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment