Intro For a project I need the ability to create my own programming language. Mostly this work is inherited from another colleague.. That said I wanted to take the time to log learnings in this space System Setup I follow a pretty standard stack in the hacker community.. I run with: OSX homebrew Ruby managed with RVM Trying to stick close to this toolbelt.. Following these steps: LLVM Install brew install llvm34 --enable-shared # note llvm did not work correctly with ruby-llvm Setup a project with a Gemfile source "http://rubygems.org" gem "ruby-llvm" gem "treetop" .ruby-version ruby-2.1.2
“Why does R2D2 always talk like this “squeak squeak squeak”” - Garrett | Watching Star Wars for the first time
““Why do they always play this music when Darth Vader is around…”” - Garrett | Watching Star Wars for the first time
When working with interactive maps on the web there are several options and decisions that need to be made before you get started. This article assumes you have decided to focus on SVG directly in the DOM to provide the map and bind interactions. Leveraging D3 D3 is wonderful library by Mike Bostok that allows you to bind data to the DOM to create beautiful data visualizations. It is a low level framework that does not constrain you to the API and really allows your imagination to run rampant. Select the Data for the Map There is a strong temptation to start with a pre-generated SVG file that is easily found around the internet as the base of your map. However, if you go with this technique and use D3 to append path elements to the DOM it will become very difficult in the future to transform, position, and scale the static path strings. Instead bind the map data to GeoJSON And leverage the goodies provided out of box from D3 to work with your map in the DOM. Advantages of GeoJSON D3 will take the GeoJSON data and convert it to a standard SVG Path after applying whatever scaling, transforms, or repositioning you require. This becomes much easier then attempting to calculate changes to the SVG commands on your own. Can apply D3 Geo Projections Can scale the map to different sizes dynamically in the DOM Can move the map to different positions in the SVG container A giant repository of earth data can be found at Natural Earth Data and converted to GeoJSON Simple Examples The following examples illustrate how easy it is to reposition a map once you have the data in GeoJSON format. In these examples it is assumed that the variable geoMapData contains the full GeoJSON object. In this example I used the one from D3 of the United States 1) Define variables, and the height and width of the SVG container var h, mapXY, path, states, w; w = 1000; h = 1000; 2) Build a function that you can apply to the projection to build the new path elements when the SVG paths are inserted into the DOM later on using standard D3 insert. In this example we are using the albersUsa Geo Projection (see below on other examples of projection types), scaling the map by 90%, repositioning the map to the center of the SVG container mapXY = d3.geo.albersUsa().scale(900).translate([h / 2, w / 2]); 3) Create a new path function that will use the new mapXY coordinates and scaling when inserting the path elements in the DOM path = d3.geo.path().projection(mapXY); states = d3.select("#geo-map").append("svg").append("g") 4) Standard D3 Insert (also color the map grey with a white stroke) states.selectAll("#states path").data(geoMapData.features).enter() .insert("path") .attr("d", path) .attr('stroke', 'white') .attr('fill', '#ccc') Now you have complete control of the Geo Projection, the scale, and the positioning of the map in your SVG container. Geo Projection Examples A few examples of what different projections look like all leveraging the exact same GeoJSON file (one line of code change above) albersUsa albers mercator
In a sea of regular inspiring awesomeness on Hacker News this one really stood out to me today: How I tricked Myself into Being Awesome This totally changed my perspective on how view writing and and learning. I hope I can follow Chris’ example with some of the work I’m doing in D3 and Web Sockets.
I’m actually really happy to see that Yehuda is kicking off an easier way to do Rails development on the OSX Platform. I agree it is completely painful. My earlier post has had flaws (the 1.8.7 seg fault on gem installs). Many thanks to @alexrothenberg for pointing me to this article: http://jfire.io/blog/2012/03/02/xcode-4-dot-3-homebrew-and-ruby/ Before going through this. A few things to make life easier: Make sure that Xcode 4.3 command line tools are installed for homebrew Make sure that libksba is installed brew install libksba TL;DR Version from John $ brew update $ brew install autoconf automake $ brew install https://raw.github.com/Homebrew/homebrew-dupes/master/apple-gcc42.rb $ rvm get head $ rvm install 1.8.7 $ rvm install 1.9.3-head
I blew away my entire OS and reinstalled Lion today. To my surprise Xcode 4.3 was released 3 days ago and most of the documentation I found was all tied to Xcode 4.2. Here are the steps I followed to get my working ruby environment back up and running. Your milage may vary: 1) Dumped Xcode all together and used the ossx-gcc-installer 2) Installed Homebrew per the website, nothing special 3) Added the following line to my .bash_profile export CC="gcc" 4) Sourced my .bash_profile (. ./.bash_profile) 5) NOW, rvm install as normal. The order of setting the bash_profile prior is very important. 6) Back to executing commands as I expected: rvm install 1.9.3 rvm install 1.8.7
Best Animated Movies - Rotten Tomatoes - Netflix Streaming: Recently ran across the top 75 animated movies from Rotten Tomatoes. In typical Geek Dad form I want to know which of these are ready to go on Netflix streaming: #57 The Secret of Kells #45 Mary and Max #43 Ghost in the Shell #37 The Secret of Nimh #14 The Iron Giant Kind of sad actually, I was really hoping for more…
The proof of concept went brilliantly (see below) !! We were extremely excited and decided to jump into our first feature. The Setup I discussed with my son that this would take some patience and work before we got to the final movie. We needed to: Build the story board - My son built the basic premise that there was going to be a shark attack in Atlanta. The shark was going to eat lots of people. Then a dinosaur was to eat the shark. Create the characters - I had to explain that the movie would be composed of lots of little pictures and that it would take quite a bit of patience to put it all together. Before we could get started on the picture taking, however, each character had to be created Find a better location - The kitchen table was in the middle of a high traffic area, and for the movie to come out right we needed some place that “little sisters wouldn’t bump the table during filming” The Equipment I was amazed on how easy this was to do on “the cheap” and come out looking really nice. All we required to get started was A tripod: to keep the camera steady between photographs - could also use a stack of books, just something to keep the camera very stable between pictures. A digital camera: does not need to be a fancy DSLR, my point and shoot worked just fine. iMovie: the built-in movie software on OS X worked wonderful! I’ll explain some of the settings further down to make life a bit easier when recreating these. Play-doh A blue paper notebook (as the background for water) The Setup The camera setup is pretty obvious, but to be completely illustrative this is how we designed our scene: Frame Rates and Picture Volume We discovered that we could achieve pretty good results at about 10 frames per second and moving the figures .25" to .50" per frame. In total we had approximately 80 “Shark Attack” photos in our scene for whopping 8 seconds of video!! Sample Shot: n Sample Shot: n+1 iMovie: Also Great for Claymation! Who knew that with a few tweaks that iMovie is a great platform for stitching together animations! Here are the steps that we performed to piece it together. Step 1: Create a new iMovie Project with the standard: File => New Project Step 2: Select: No Theme (for the template) Step 3: Open Project Properties File => Project Properties Step 4: Remove Ken Burns effect and change to “Fit in Frame” Step 5: Import all your 80+ photos from iPhoto to the iMovie Project Easy as drag and drop! Try to maintain the order and remove any blurry or unwanted photos. Step 6: Bump the time between photos from 4 seconds to .1 second Select a photo and then select the little blue gear icon. From there select the “Clip Adjustment” and make sure you apply the change to all photos. Step 7: Have fun in iMovie! The movie at this point is basically made. You can now have a lot of fun adding in iMovie goodies like transitions, sound tracks, and titles. Here is what our storyboard looked like before we finalized. The Final Product! It was a wonderful experience and great lessons in patience and hard work to make a fun final product for the kids. My son also learned when enough is enough. You’ll notice that the shark survives another day as the dinosaur has yet to make his appearance. Perhaps … The sequel…. shark-attack from Thomas Newton on Vimeo.
This past weekend my kids asked me to jump in with their play-doh fun at the kitchen table. However, after 5 minutes I became bored and decided to look for other ways to make play-doh time more “interesting”. The first thing that came to mind was the animated shorts of Gumby and Wallace and Gromit. I grabbed my Canon s100 point-and-shoot, set it up on a couple of cans of play-doh, and did a quick proof of concept (stitching the snapshots together with iMovie) First Attempt play-doh from Thomas Newton on Vimeo.
“Unless someone like you cares a whole awful lot, nothing is going to get better. It’s not.” - Dr. Suess