Light

niyorn / fe3-assessment-2 Goto Github PK

View Code? Open in Web Editor NEW

This project forked from bryanvdelft/fe3-assessment-2

0.0 1.0 0.0 1.36 MB

🏆🏆 Frontend 3 · 2017-2018 · Assessment 2 starter code

Home Page: https://niyorn.github.io/fe3-assessment-2/

HTML 9.80% CSS 12.54% JavaScript 77.66%

fe3-assessment-2's Introduction

This graph show the weight of women and men over the years. Data is taken from here: http://statline.cbs.nl/statweb/publication/?dm=slnl&pa=81565ned&d1=a&d2=a&d3=0&d4=a&d5=29-34&hdr=t&stb=g1,g2,g3,g4&

Data

First of all the graph is a stacked graph. Where the bottem color show the underweight, the middle color normal weight and the top color the overweight;

The X-axis show the the year that the data has been measured; The Y-axis show the percentage of the different catagory;

TODO

The Y-axis doesnt change when the user click on a catagory.
Add tooltip
Add % sign so that the user know its about percentage

fe3-assessment-2's People

Contributors

Watchers

fe3-assessment-2's Issues

Cool demo gif!

And pretty cool visualization!

Something is going wrong with the y scale

If I click on 'overgewicht' I get the same number >70 for every year. If I then click on normaal I get the same number >80. That means together theyre >150% 📦
So Im guessing only the man and women views currently work.

You havent described what your additions are to the code youve found

BEcause of that I dont know what to give you credit for... Next time put them in your changes section of the readme or describe it in the code comments.

Overall I like how you used an original charttype

Some things are still pretty glitchy and the code could use some improvements but overal its a decent attempt.

You didnt describe your process

Also the data desc is very minimal. I cant tell from the readme how you cleaned code or added interaction. You also dont describe features or a license.

For some reason the bars are extremely narrow on my screen

They dont look at all like the wide bars in your demo gif

There are some magical (hardcoded) values in your code

Like highestDataPoint = 60;
I think you had a lot of trouble getting this charttype to work so I wont be too hard on you here.

Its very hard to see trends with your current vis

I thinka line chart would work much better here.

Recommend Projects

React

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

🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript

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

An Open Source Machine Learning Framework for Everyone
Django

The Web framework for perfectionists with deadlines.
Laravel

A PHP framework for web artisans
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.
Visualization

Some thing interesting about visualization, use data art
Game

Some thing interesting about game, make everyone happy.

Recommend Org

Facebook

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

Open source projects and samples from Microsoft.
Google

Google ❤️ Open Source for everyone.
Alibaba

Alibaba Open Source for everyone
D3

Data-Driven Documents codes.
Tencent

China tencent open source team.