Scribd
Upload
65 views

Javascript Vis Progress: Tim Disney

The document discusses JavaScript and provides an overview of the language. It then shows examples of JavaScript code and describes how values and functions are represented at the top level and as properties of the window object. It poses questions about understanding project structure in JavaScript and how the structure changes over time. The document outlines the current approach of walking the window object to gather data and generating a radial graph visualization using a toolkit. It concludes with planned next steps such as handling changes over time and finding examples to analyze.

Uploaded by

disnet03
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
65 views

Javascript Vis Progress: Tim Disney

The document discusses JavaScript and provides an overview of the language. It then shows examples of JavaScript code and describes how values and functions are represented at the top level and as properties of the window object. It poses questions about understanding project structure in JavaScript and how the structure changes over time. The document outlines the current approach of walking the window object to gather data and generating a radial graph visualization using a toolkit. It concludes with planned next steps such as handling changes over time and finding examples to analyze.

Uploaded by

disnet03
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 9

JavaScript Vis Progress

Report
Tim Disney

Tuesday, June 8, 2010


JavaScript Crash Course

• Very dynamic language


• no compilation
• no static typing
• Looks like Java, acts like Scheme/Self
• All about objects
• no class/object distinction
• objects are dictionaries/maps/hashes
Tuesday, June 8, 2010
JS top level script

var myObj = {
foo: "bar",
baz: 42.34
}

function myFun() {
var localVar = 5;
globalVar = 22;
}

Tuesday, June 8, 2010


JS top level script window object

var myObj = { {
foo: "bar", myObj: {
baz: 42.34 foo: “bar”,
} baz: 42.34
},
function myFun() {
var localVar = 5; myFun: <function>,
globalVar = 22;
} globalVar: 22
}

Tuesday, June 8, 2010


Questions to Answer

• Project Structure
• Where are the “important” objects?
• What are “messy” projects?
• What functions/fields are visible?

Tuesday, June 8, 2010


Questions to Answer

• How does structure change?


• What gets added/removed/modified
when I click a button?
• Are things changes that shouldn’t?

Tuesday, June 8, 2010


What I have
• Walking the window object to get data
• element names
• element types (function/string/number)
• filtering
• Using JIT (JavaScript InfoVis Toolkit) to
generate a radial graph

Tuesday, June 8, 2010


DEMO

Tuesday, June 8, 2010


TODOs

• change over time


• dynamic label sizes
• find good examples of “messy”
• prototype chain?

Tuesday, June 8, 2010

You might also like