Code Monkey home page Code Monkey logo

lineup-d3's Introduction

LineUp-D3

Description

A project that implement Lineup project in D3.js.

Lineup comes from the paper: LineUp: Visual Analysis of Multi-Attribute Rankings. It is a tool for multi-attribute ranking visualization.

As the final assignment for Data Graphics course in USF, we(Wentao Du, Siwei Zhang, Kaijie Zhou ) implemented a subset for Lineup in D3.js and Javascript.

In this project, we use R script to clean the incoming dataset. We need use to provide a Json file to tell us which attributes are needed to be used for ranking. The R script will transform the dataset into the input of our Javascrip function. And the Javascript function will show the ranking table.

For now, we've already cleaned four datasets for demo: University ranking for 2013, Cars dataset and NBA player performance dataset for 2009. We also provide a control panel for user to play with the datasets we provided. The control panel is implemented by Bootstrap.

Contents

index.html: The index page of the project demo. The implementation of control panel is here.

js/line_up.js: The core functions for lineup project including ranking, drag-able edges and so on.

js/vertical_bars.js: The core functions for header histogram. Also a part of lineup core functions.

clean_lineup_data.R The script for cleaning data for Lineup project. Usage: RScript clean_lineup_data.R path/to/input.json path/to/output.json

origin/: This folder contains all the original datasets and json files for the R script.

data/: This folder contains all the cleaned data and json files generated by the R script. They are ready to be used for our project

Lineup D3 Impl Slides.pptx: The slides for our final presentation. See also here.

Processbook.pdf The process book for the project which note down the progress of each release for our project. See also here.

Other files Includes css/, fonts/, images/ and other files in js. These files are used by Bootstrap.

Demo link

You can see the demo of this project though this link.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.