Dive into E2D3

E2D3 is an Open Source project allowing Excel users to bring D3 charts into the world of spreadsheets.

Transcript

1. Dive into E2D3
   How to use D3.js on Excel
   SAWA, Norihiko
   @D3.js meetup in San Francisco
   http://www.meetup.com/Bay-Area-d3-User-Group/events/227062987/
   

   View Slide

2. Who I am?
   SAWA, Norihiko
   Software engineer at Nikkei
   nakamods320yen
   

   View Slide

3. Who I am?
   Software engineer at Nikkei
   - Data visualize
   - Mobile Apps
   

   View Slide

4. I love nutella
   

   View Slide

5. View Slide

6. https://store.office.com/WA104379169.aspx?assetid=WA104379169
   

   View Slide

7. Do you use Excel?
   

   View Slide

8. Then
   

   View Slide

9. Do you like Charts on Excel !?
   

   View Slide

10. All we have design guidelines
    

    View Slide

11. View Slide

12. But many people like Excel
    

    View Slide

13. This is E2D3
    

    View Slide

14. Stats
    Install: 13000
    Charts: 50+
    Contributors: 20+
    

    View Slide

15. Requirements
    Excel for Windows 2013 or later
    Excel Online (Office365)
    (Excel for mac is not available)
    

    View Slide

16. How to add charts
    

    View Slide

17. We are OPEN SOURCE
    

    View Slide

18. How to add charts
    $ npm install -g e2d3
    $ git clone git@github.com:e2d3/e2d3-contrib.git
    e2d3-contrib$ e2d3
    [E2D3] Publish /Users/chimera/Sites/e2d3-server/e2d3/contrib
    [E2D3] Webserver started at http://0.0.0.0:8000
    [E2D3] Webserver(SSL) started at https://0.0.0.0:8443
    Setting up
    

    View Slide

19. Reffering to localhost by type Ctrl key 5 times
    

    View Slide

20. regulations of files
    How to add charts
    directory name for each charts
    ├ main.js
    ├ main.css
    ├ thumbnail.png
    └ README.md
    

    View Slide

21. Thumbnail.png
    

    View Slide

22. README.md
    

    View Slide

23. structure of main.js
    

    View Slide

24. Reserved words
    root
    HTML Element to show charts
    function reload()
    to call update() manually
    

    View Slide

25. Fork us: e2d3/e2d3-contrib
    https://github.com/e2d3/e2d3-contrib
    @e2d3org
    

    View Slide