Skip to content

Instantly share code, notes, and snippets.

@micahstubbs
Last active September 3, 2017 01:41
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 micahstubbs/afe2b4dd68e6938d34073ab4c397e621 to your computer and use it in GitHub Desktop.
Save micahstubbs/afe2b4dd68e6938d34073ab4c397e621 to your computer and use it in GitHub Desktop.
d3unconf badge GIF
license: mit
border: no
height: 1500

this block but in 31 megabyte gif form.


this iteration makes the dimensions 1050 x 1500 to work nicely with http://badgetron.com/


the camera position is currently a bit off in the Vive. checkout this commit commit hash 48e99fbb1bc66bd4b890d8bb170287d61092109e for a version where the camera position tracks the Vive HMD position when in VR. follow the stackoverflow question how to reset camera position on enter VR? for a possible method to show a custom camera position in 2D mode and a glued-to-the-hmd camera position when in VR

--<>--

a roomscale VR scene targeting the HTC Vive

use the front-trigger on either Vive controller to pick up and inspect a block

block a-boxes positions are closer to the origin than in previous examples so that they are within reach from in roomscale VR. ROADMAP: teleport locomotion ;-)

many thanks to @bryik_ws, @utopiah, @donrmccurdy over at the A-Frame slack for help getting the interaction working.

do get a slack invite of your own and check out the other places the A-Frame community gathers


all the blocks with thumbnail images created during the 2016 #d3unconf

here we use aframe's a-boxes, which are kind of like SVG rects

a fork of aframe + d3 + bl.ocks from @donrmccurdy

falling blocks brought to you by the aframe-physics-system, also from @donrmccurdy

inspired by the conversations at the 3d and VR 11am session in the Alcatraz Room at the 2016 d3 unconference

forked from micahstubbs's block: aframe-blocks roomscale 03

forked from anonymous's block: aframe-blocks roomscale 03 -

[
{
"id":"3757fe53ea94da4100db2e5071ea8289",
"sha":"f37923e838ee6db8fcb20091d305ebce04404f1b",
"description":"d3 blocks on a-boxes",
"owner":{
"login":"micahstubbs"
}
},
{
"id":"e70e14483fe01eb0a3ea7d1d46a30571",
"sha":"7e3906f8d8a9e5d79d61f2b77cc16f2829cb4a92",
"description":"Musical Hexagons",
"owner":{
"login":"vasturiano"
}
},
{
"id":"0ba5ee8bd3773d70462523679d4ef5a4",
"sha":"30d1ebaccc65e061989090e948526917c09db5f7",
"description":"Delaunay Force Mesh II",
"owner":{
"login":"erlenstar"
}
},
{
"id":"de2b023d968abb7276b894409efdac56",
"sha":"2a168d34c566b37bbdacbeb144c8ff9e14a32175",
"description":"merging selections",
"owner":{
"login":"enjalot"
}
},
{
"id":"7d3f8beb9faa183fc8d4fe3fd1610e00",
"sha":"b92274a2b8d9e8653ca020d89bc42e75c086bf09",
"description":"d3 yoga",
"owner":{
"login":"enjalot"
}
},
{
"id":"57fbb830ba7e62caa46a82891168bc29",
"sha":"a5ae874d673654d9fc7a18e09efca0591082b8bb",
"description":"CMYK zoom",
"owner":{
"login":"veltman"
}
},
{
"id":"e8ccca52559796be775553b467593a9f",
"sha":"269b11fe342729ca6a70db087ff0e3f2fd8b2122",
"description":"Continuous Legend",
"owner":{
"login":"syntagmatic"
}
},
{
"id":"6c73711f8f24af9808a9031a69f75b18",
"sha":"52e696e66b5bb8d833b82ea5b429532a4336f96f",
"description":"Stereographic",
"owner":{
"login":"erlenstar"
}
},
{
"id":"a1eb3bdecd2ab1be1de2425a260cc0f7",
"sha":"feca193fc32e1606b0e53a9a873c797f2e332b64",
"description":"Spirograph Geometric Flowers",
"owner":{
"login":"EfratVil"
}
},
{
"id":"8c5a0e697673fd676be6823589e1ce31",
"sha":"40dcc4e31ed53cb403e36dd07288678f21ae6cfe",
"description":"stroke-dash-array",
"owner":{
"login":"jermspeaks"
}
},
{
"id":"b04d673fbfc665f2c98f382e2c79a9ad",
"sha":"6e7cf7e122c99bfa6bfa47e6f035472020e9730a",
"description":"Voronoi Tessellation",
"owner":{
"login":"git-ashish"
}
},
{
"id":"1fd92b8c309a0fdc71b0a64c788a70e7",
"sha":"227f453f79e7f56e2c4cbec1dc0110bfe5960e18",
"description":"Canvas Voronoi",
"owner":{
"login":"git-ashish"
}
},
{
"id":"6a6c2f11f9493adba658003a5a18a107",
"sha":"d7c669281c38b23d8b21eecb56ed6991e6d2c10b",
"description":"Voronoi Labels",
"owner":{
"login":"git-ashish"
}
},
{
"id":"a5d147cd45c624e8811238f0a5480439",
"sha":"7341de0028d33120fa8316619b8d0e6fdb170410",
"description":"Comunidad Valenciana population(d3v4)",
"owner":{
"login":"LuisSevillano"
}
},
{
"id":"cd0c38a20141e997e926592264067db3",
"sha":"5766833b6df73d777c7b6f10b3fc088bf32d99b2",
"description":"cluster force",
"owner":{
"login":"ericsoco"
}
},
{
"id":"50a350e86de82278ffb2df248499d3e2",
"sha":"137caaf4c0de8590d808ee35bf2ab6668109374c",
"description":"CMYK halftone printing",
"owner":{
"login":"veltman"
}
},
{
"id":"32f369bb437d7c23198b9b9ccc8d4751",
"sha":"c7f2be04e7fe9a4781940e73fb1896eb471714db",
"description":"d3.unconf 2016, v11",
"owner":{
"login":"micahstubbs"
}
},
{
"id":"a7495ca3d5b322a6697530feb62fceef",
"sha":"719e306c9885a691244c01a228aa84ca594b299a",
"description":"Painting Manhattan-distance Voronoi",
"owner":{
"login":"Fil"
}
},
{
"id":"99767e64051096388078913afca3ff4e",
"sha":"ac755a56347c9941c8e0d27067e69cdc41b4c0b9",
"description":"Choropleth with d3-cluster-scale",
"owner":{
"login":"schnerd"
}
},
{
"id":"82144236b9a920f77e3af1776d265c57",
"sha":"ff6b6f78560e73ddc3735ded012fba7524bfbc8b",
"description":"d3.unconf 2016, v10",
"owner":{
"login":"sxywu"
}
}
]
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>A-Frame / Bl.ocks / D3 GIF</title>
</head>
<style>
body{
margin:0;
}
.scene-container {
width: 1050px;
height: 1200px;
margin-top: 200px;
}
</style>
<body>
<div class="padding">
</div>
<div class="scene-container">
<img src="vr-blocks-for-badge-1.gif" alt="Loading" title="Loading" />
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment