D3.js and E2D3Data visualization 4 your Excel/website

October 04, 2015E2D3 Open source project

What is “E2D3”? free add-in for your Excel 2013/365

E2D3 is the Global/Japanese Open Source Project.

Won the Award : E2D3 (2014-2015)

Award1. Technology Edge Prize

, Microsoft Innovation Award 2015, 2015. 6. 112. Attention Score Ranking 1st x 6 times，Schoo

Web School, 2015. 3. 243. Visualizing technology prize,

LOD (Linked Open Data) Challenge Japan 2014, 2015. 3. 124. TOP20 (/359), Mashup Awards 10, 2014.11. 195. Microsoft Prize, Mashup Awards 10, 2014.11. 196. TOP3, Microsoft Office Application Idea Contest

organized by MM Souken & Microsoft Japan, 2014. 9. 247. Special Prize, Microsoft Office Application Development Co

ntest organized by Nikkei software magazine & Microsoft Japan, 2014. 6. 24

Are you struggling with Excel graphs?

Familiar Situation?・ My graphs can make people disappointed・ To be honest, I cannot keep up with new Excel features・ Somehow, more efforts to improve graphs lead nowhere

Ideally,

※ McKinsey quality graphs…・ Easy to understand, and stylish・ Is it art?・ Somebody may actually pay you for your work!

・ I’m not born with artistic talent…・ Can you really make nice graphs using Excel or Powerpoint?・ No time to polish my graphs

I’ve tried hard… but with not much outcome

樹海

Wish Excel graph templatesWere nicer…

E2D3 Can Help You!

With E2D3 graph template..

・ I can make stylish graphs on Excel, easily!

How Stylish!

Overview of D3 & E2D3

① What can you accomplish with E2D3② What can display with D3.js③ How to use app within Excel④ Graph template development⑤ About E2D3

① What can you do

with E2D3?

E2D3 is…An Excel application, which displays D3.jp created graphs

D3.js created graph

Library of javascript, specifically for drawing

Excel

Amazing!Wow!

E2D3(Excel to D3)

What can you do with E2D3?

・ Choose from beautiful graph templates・ The Excel data is immediately reflected in a graph

②How far D3.js can

Go?

D3.js expression- Beautiful!

D3.js expression: amazing!

D3.js expression: wow!

D3.js expression

・ Beautiful templates・ Nuanced color expression・ Graphs move! （ it’s run on javascript ）

D3.js Expression

javaScript graphic library Ranked 1st in 2015!

人気上昇中の JavaScriptライブラリを調べてみた【 2015年版】http://www.buildinsider.net/web/popularjslib/2015

Can you make beautiful graph on your own?

With E2D3 app,You can do it!

③How to Use with Excel

Downloading App:

① Choose Office App ② Search for “E2D3”

③ Choose graph template ④ Finish!

Example （ Moving bubble chart ）

Av. Life expectancy

Income

Size of the circle:

Population

Use mouse to see chronological trend

④How to make a Graph Template

How to make a graph template1) Register as “contributor”2) Source code is on E2D3 github. Apachel Licence

2.0

Contributor(Programmer

with D3.js knowledge)

(Pull Request)

E2D3Project Member

javascriptcssSample dataExplanation

Approval

Users Worldwide

⑤About

E2D3 Project

Contributors(Programmer who

knows D3.js)

E2D3Project Team

Users

E2D3 project supporters

Enjoy using E2D3 graphs

Create new exciting graphs using D3.jp

Runs E2D3 project　・ E2D3 Application development　・ Develop platform　・ D3.jp material translation

E2D3 on Office App Store

Started as a two-men project May 2014

1. Special Award,  「 Office App development contest, 2014. 6. 242. TOP3, Office App Idea contest, 2014. 9. 24  

September 2014, 15 project members

1. Top 20 ， Mashup Awards 10, 2014. 11. 192. Microsoft Award ， Mashup Awards 10, 2014. 11. 19 

E2D3 Team grew into

50 person teamNow

E2D3 open source project• 【 Developmental History 】

– Future Plan of ver. 0.4– Settup method of Office365 & Napa for Mac user (text) of ver. 0.3– Settup method of Office365 & Napa for Mac user (movie) of ver. 0.3– Developers Instruction of ver. 0.3– Developers Instruction of ver. 0.2– API Instruction of ver. 0.2– Install Method for Developer 2 of ver. 0.2– Install Method for Developer 1 of ver. 0.2

Activity log 1: E2D3 open source project• 【 Related Articles 】

– GUNMA GIS GEEK, E2D3 Tips

• 【 Event 】– Open Data Hackathon for an election of Saitama Prefecture Governor, 2015. 8. 2 (Report1, 　 Event)– NewsPicks & SPEEDA Smart Data Experience Hackathon powered by E2D3, 2015. 6. 14 (Event,

Report)– Github workshop with E2D3 powered by CircleAround, 2015. 5. 29 (Slide, Event)– GreenHack & E2D3 Hackathon for Kids -Let’s play with charts!, 2015. 5. 10 (Event, Report)– IT Programming Day organized by E2D3, 2015. 5. 6 (Event)– Political Data Visualization Programming Day, 2015. 4. 18 (Event)– Political Data Visualization Hackathon Vol. 1, 2015. 4. 11 (Slide, Event, Report 1, Report 2)– Code for YOKOHAMA & E2D3 Programming Day, 2015. 4. 10 (Event)– E2D3 Hackathon, 2015. 2. 8 (Event, Report)

• 【 D3.js & E2D3 Hands-on seminar 】– Hideyuki Takeuchi and Akira Inoue, Schoo WEB-campus, 2015. 3. 25 (Slide, Event)– Keisuke Osone, “D3.js Hands-on“, E2D3 Hackathon, 2015. 2. 8 (Slide, Code)

• 【 Presentation 】– Shoichi Otomo, “Data Visualization by using E2D3 (Excel to D3)”, FOSS4G (Free Open

Source Software for GeoSpatial) 2015 Hokkaido, 2015. 7. 3 (Event)– Takashi Iki, GreenHack & E2D3 Hackathon for Kids -Let’s play with charts!, 2015. 5. 10 (

Slide, Event)– Hideyuki Takeuchi, “Introduction to E2D3 PJ”, Ebisu Startup Enginer Study Group #2,

2015. 4. 23 (Slide, Event)– Takashi Iki, 6th NikoNiko Conferenceβ Data Research Group, 2015. 4. 12 (Slide, Event)– Yu Yamamoto, 4th Apps for Office workshop, 2015. 3. 14 (Slide, Event)– Tuyoshi Matsuzaki, Open Source Conference, 2015 Tokyo/Spring, 2015. 2. 28 (Event)– Yasunobu Igarashi, “Open-innovation around E2D3”, Big live-Data Meets Machine

Learning on Database, 2015. 2. 14 (Slide, Event) – The Asahi Shimbun and E2D3, Journalism Innovation Award, 2015. 1. 24 (Event)– Yasunobu Igarashi, “Invitation to E2D3”, Combinator Meetup × Startup School, 2015. 1.

21 (Event)– Yasunobu Igarashi, “Graph it forward by using E2D3”, Data Visualization Japan

meetup#2, 2014. 12. 25 (Slide, Movie, Event)

Activity log 2: E2D3 open source project

• 【 Exhibition 】– LOD Chellange 2015 Kickoff, 2015. 9. 26 (Event)– Tech in Asia Tokyo 2015, 2015. 9. 8 (Event)– Learning Technology 2015, 2015. 7. 15-17 (Event)– App Expo, 2015. 3. 23 (Event)– LOD Challenge 2014 Conference, 2015. 3. 19 (Event)

• 【 Developmental History 】– Future Plan of ver. 0.4– Settup method of Office365 & Napa for Mac user (text) of ver. 0.3– Settup method of Office365 & Napa for Mac user (movie) of ver. 0.3– Developers Instruction of ver. 0.3– Developers Instruction of ver. 0.2– API Instruction of ver. 0.2– Install Method for Developer 2 of ver. 0.2– Install Method for Developer 1 of ver. 0.2

Activity log 3: E2D3 open source project

• 【活用事例】– goo スマホ部, ドコモ圧勝！iPhone 6s発売日に速度調査（大阪環状線）, 2015. 8. 8

– 朝日新聞デジタル, 衆院選を動くグラフに　激増する無効・棄権票, 2014. 12. 19

– withnews, 得票率１割台で政権取る可能性　グラフで見る衆院選, 2014. 12. 2

• 【メディア掲載】– Thanks for authors !– 毎日新聞, 争点、課題、ＩＴで分析　都内で「知事選ハッカソン！」, 2015. 8. 8

– THE BRIDGE, 革新的なアイデアとプロダクトでイノベーションを創りだす：「Microsoft Innovation Award 2015」を授賞した13チーム, 2015. 6. 30

– ASCII.jp, 今年は画像解析？Microsoft Innovation Award 2015開催, 2015. 6. 17

– IT media, Microsoft Innovation Award 2015は機械学習、IoT、3D、KINECT、データ活用祭り, 2015. 6. 24

– goo スマホ部, NewsPicksに学ぶ、スマホでインフォグラフィック, 2015. 6. 17

– goo スマホ部, 新しい政治の見せ方を考えよう！―政治データ可視化ハッカソン, 2015. 4. 18

– gooスマホ部, 人気の高いアプリはどれ？「アプリ博2015」レポート, 2015. 3. 26

– 日経ソフトウェア, 2014年8月号 p. 19

– IT Pro, 日経ソフトウェア 「Office用アプリ」開発コンテスト 結果発表, 2014. 6. 24

Activity log 4: E2D3 open source project

We believe in a huge potential of

E2D3 project(and have passion!)

How to get involved with E2D3 project.

■E2D3 Official webpage　　 http://e2d3.org/

■Facebook （ E2D3 user group ）　　 https://www.facebook.com/groups/369091606599239/

■twitter （ Results for #e2d3 ）　　 https://twitter.com/search?f=realtime&q=%23e2d3

We are looking for new team member to develop E2D3 free add-in for your Excel!

Please join E2D3 global/Japanese open source project