10 оригинальных визуальных проектов, сделанных с помощью бесплатного инструмента визуализации D3.js

Ville Vivante
Ville Vivante
Срав­не­ние каче­ства жиз­ни, паде­ние метео­ри­тов, гло­баль­ная мигра­ция и обра­зо­ва­ние миро­вых лиде­ров – пред­став­ля­ем вам под­бор­ку про­ек­тов, кото­рые мож­но сде­лать при помо­щи инстру­мен­та визу­а­ли­за­ции D3.js.

D3.js – это биб­лио­те­ка JavaScript, с помо­щью кото­рой мож­но делать визу­а­ли­за­ции для веба. В отли­чие от мно­гих дру­гих инстру­мен­тов, D3 име­ет широ­кое при­ме­не­ние в самых раз­ных обла­стях – от созда­ния интер­ак­тив­ных визу­а­ли­за­ций на осно­ве боль­ших дан­ных до кар­то­гра­фи­ро­ва­ния. Пред­став­ля­ем вам под­бор­ку про­ек­тов, демон­стри­ру­ю­щих самые силь­ные сто­ро­ны это­го инстру­мен­та.

OECD’s Better Life Index (personal Remix)

Где луч­ше все­го жить? Визу­а­ли­за­ция OECD’s Better Life Index поз­во­ля­ет срав­нить пока­за­те­ли раз­ных стран, вхо­дя­щих в ОЭСР. Пере­тас­ки­вая кра­си­вые икон­ки стран, каж­дая из кото­рых содер­жит инфор­ма­цию о дан­ной стране, мож­но быст­ро и нагляд­но срав­ни­вать их друг с дру­гом.

Посмот­реть визу­а­ли­за­цию.

Fireball from Outer Space

Fireball from Outer Space
Fireball from Outer Space

Fireball from Outer Space – это интер­ак­тив­ная визу­а­ли­за­ция метео­ри­тов, упав­ших на Зем­лю за послед­ние 100 лет. D3 под­дер­жи­ва­ет гео­гра­фи­че­ские про­ек­ции, в том чис­ле исполь­зу­е­мую здесь трех­мер­ную про­ек­цию, что дела­ет его мощ­ным инстру­мен­том для кар­то­гра­фи­ро­ва­ния.

Посмот­реть визу­а­ли­за­цию.

City Streets

City Streets
City Streets

City Streets – это кол­лек­ция визу­а­ли­за­ций карт попу­ляр­ных горо­дов. Про­ект был создан с помо­щью D3.js и TopoJSON, откры­тых дан­ных с openstreetmaps, и нагляд­но демон­стри­ру­ет, как D3 может быть исполь­зо­ван для созда­ния деталь­ных карт.

Посмот­реть визу­а­ли­за­цию.

The incredible rise of migrants” remittances

The incredible rise of migrants' remittances
The incredible rise of migrants” remittances

Визу­а­ли­за­ция The incredible rise of migrants” remittances рас­ска­зы­ва­ет о гло­баль­ной мигра­ции и эко­но­ми­ке. На гра­фи­ке пока­за­но коли­че­ство средств, кото­рое мигран­ты высы­ла­ют в свои стра­ны, начи­ная с 1970 года. Клик­нув на стра­ну, мож­но про­смот­реть допол­ни­тель­ную инфор­ма­цию о ней.

Посмот­реть визу­а­ли­за­цию.

Close Votes

Close Votes
Close Votes

Осно­ван­ная на пар­ла­мент­ских выбо­рах 2012 г. в Нидер­лан­дах визу­а­ли­за­ция CloseVotes пока­зы­ва­ет, в каких горо­дах голо­са изби­ра­те­лей рас­пре­де­ли­лись похо­жим обра­зом. Кро­ме того, дан­ная визу­а­ли­за­ция хоро­шо демон­стри­ру­ет воз­мож­но­сти D3 в быст­ром пере­клю­че­нии меж­ду раз­лич­ны­ми вари­ан­та­ми отоб­ра­же­ния визу­а­ли­за­ций – гео­гра­фи­че­ском и ради­аль­ном.

Посмот­реть визу­а­ли­за­цию.

Canadian Population Pyramids

Canadian Population Pyramids
Canadian Population Pyramids

D3 может быть исполь­зо­ван для созда­ния и тра­ди­ци­он­ных гра­фи­ков, с кото­ры­ми мож­но вза­и­мо­дей­ство­вать, так, напри­мер, интер­ак­тив­ная визу­а­ли­за­ция CanadianPopulationPyramids пока­зы­ва­ет воз­раст­ное рас­пре­де­ле­ние насе­ле­ния Кана­ды.

Посмот­реть визу­а­ли­за­цию.

Ville Vivante

Ville Vivante
Ville Vivante

Ville Vivante – это интер­ак­тив­ная визу­а­ли­за­ция «циф­ро­вых сле­дов», остав­лен­ных поль­зо­ва­те­ля­ми мобиль­ных теле­фо­нов в Жене­ве за один день.

Посмот­реть визу­а­ли­за­цию.

Scientific dashboard

Scientific dashboard
Scientific dashboard

Scientific dashboard – это экс­пе­ри­мен­таль­ный про­то­тип, пред­став­ля­ю­щий собой ком­би­на­цию худо­же­ствен­но­го под­хо­да и кон­цеп­ций, поза­им­ство­ван­ных из физи­ки. Дан­ные гене­ри­ру­ют­ся слу­чай­ным обра­зом, но могут быть так­же взя­ты отку­да угод­но – с любо­го сен­со­ра или веб-сер­ви­са.

Посмот­реть визу­а­ли­за­цию.

Shooting stars!

Shooting stars!
Shooting stars!

Визу­а­ли­за­ция Shooting stars! – это иро­нич­ная вари­а­ция на тему тра­ди­ци­он­ных гра­фи­ков. В дан­ной визу­а­ли­за­ции вы може­те наблю­дать клас­си­фи­ка­цию филь­мов по типу сце­на­рия и успеш­но­сти в про­ка­те (вы зна­ли, что филь­мы с самы­ми попу­ляр­ны­ми сюже­та­ми не самые успеш­ные?).

Посмотреть визу­а­ли­за­цию.

How educated are world leaders?

How educated are world leaders?
How educated are world leaders?

How educated are world leaders? – это после­до­ва­тель­ность диа­грамм, визу­а­ли­зи­ру­ю­щих уро­вень обра­зо­ва­ния миро­вых лиде­ров, начи­ная с 1950 года и до наших дней.

Посмот­реть визу­а­ли­за­цию.