blog

For beginners in using Adobe Illustrator, it may seem complicated to use at first. That’s why I’ve uploaded a simple project anyone could follow. Creating characters using basic shapes are easy, and in this time-lapse video you could get some ideas on what to do.

In Illustrator, it is a huge key to think in shapes. Most objects can be created from basic shapes, and we can create characters using these shapes.

The Pathfinder is also your friend. You can combine shapes, subtract shapes, divide a shape (and more) to create a new kind of shape.

This tutorial is about D3.js, a JavaScript library for manipulating documents based on data. D3.js is developed by Mike Bostock.

How to Embed a D3.js Visualization into PowerPoint

There’s a way to apply D3.js visualizations directly into PowerPoint. This method includes interactivity (not static). This is helpful especially for a seamless presentation that doesn’t require opening a browser to show a D3.js viz.

Simply follow the steps below:

1. Download the LiveWeb plug-in

The LiveWeb plugin works on PowerPoint versions up to 2013. It allows you to insert web pages into a PowerPoint slide. You can download LiveWeb [here](http://skp.mvps.org/liveweb.htm)

2. Configure Liveweb Plugin

By default, Microsoft blocks the ActiveX control that enables LiveWeb to work properly. To remedy this, go to Registry Editor (type ‘regedit’ on Windows search). Navigate to the following registry:

Click to Run installation of Office 2013:
subkey:HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Office\15.0\ClickToRun\REGISTRY\MACHINE\Software\Wow6432Node\Microsoft\Office\15.0\Common\COM Compatibility\

Now find the Web Browser Control {8856F961-340A-11D0-A96B-00C04FD705A2} and replace the value from 1024 to 0.

3. Configure Office Web Browser Control

The above steps should be able to make LiveWeb work, but may still cause D3 charts to not work properly. This is because Web Browser Control uses an older version of Internet Explorer by default. So we’ll be changing the registry once more to select a recent version of Internet Explorer.

The value to set this key to is: 11001 (0x2AF9). This sets the webpage view to use Internet Explorer 11.

UPDATE for WINDOWS 10: For Windows 10, you may need to create a new DWORD value with the following:
“App.exe”=dword:00002af9
“App.vshost.exe”=dword:00002af9

4. Configuring Your HTML Code

This is an alternative to Step 3 if you weren’t able to make edits to the registry properly.

Add the following code to your index.html’s head. This meta tag allows web authors to choose what version of Internet Explorer the page should be rendered as.

5. Inserting Your D3 Data Visualization

Now that the configuration is done, you may now start inserting web pages to PowerPoint.In the ‘Insert’ tab, there should be an option to insert a ‘Web Page’. A wizard will open that’s easy to follow through, and you’ll be prompted to input a web URL for your web page/visualization. You may also input a file path if you have your files saved locally.