A visualization of similarity between movies by means of a network graph
- Similarity data taken from [PopCha!] 1 recommender engine (R*)
- Movie info from [The Movie Database] [3]
- Visualization done in JavaScript with [D3.js] [2]
module Jekyll | |
class RedcarpetWithoutPygmentsParser < Converter | |
safe true | |
priority :high | |
def initialize(config) | |
require 'redcarpet' | |
@config = config | |
@redcarpet_extensions = {} |
<?xml version='1.0' encoding='utf-8' ?> | |
<!--This is the basics - platform (windows or mac)and version number--> | |
<workbook source-platform='mac' version='9.0' xmlns:user='http://www.tableausoftware.com/xml/user'> | |
<!-- build 9000.15.0318.1720 --> | |
<!--No idea what this for --> | |
<preferences> | |
<preference name='ui.encoding.shelf.height' value='250' /> | |
<preference name='ui.shelf.height' value='250' /> | |
</preferences> | |
<!--This is everything you need to know about datasources --> |
<!DOCTYPE html> | |
<meta charset="utf-8"> | |
<title>Zoomable Treemap</title> | |
<link rel="stylesheet" type="text/css" href="style.css" /> | |
<script src="http://d3js.org/d3.v2.js"></script> | |
<script src="http://code.jquery.com/jquery-1.7.1.js"></script> | |
<p id="chart"> | |
<p id="rawdata"> |
A visualization of similarity between movies by means of a network graph
<title>PopCha! Movie Network</title> | |
<link rel="stylesheet" href="movie-network.css"/> | |
<link rel="shortcut icon" href="popcha.ico" type="image/x-icon"> | |
<script> | |
// Sniff MSIE version | |
// http://james.padolsey.com/javascript/detect-ie-in-js-using-conditional-comments/ | |
var ie = ( function() { | |
var undef, | |
v = 3, | |
div = document.createElement('div'), |
1 homotopy theory | |
1-1 correspondence | |
1-4-2 problem | |
1-center problem | |
1-connected | |
1-dimensional euclidean space | |
1-factor | |
1-form | |
1-median | |
1-parameter subgroup |
//============================================================ | |
// Structure, Flow and Layout | |
//============================================================ | |
// inline-block fix incl. ie7 support | |
.inline-block { | |
display: inline-block; | |
*display: block; | |
*zoom: 1; | |
} |
The Compose logo is an isometric tetromino and I thought it would be fun to shift through other tetromino shapes for a loading animation.
A Pen by Brandon Mathis on CodePen.