Tag: vis

How to Deploy D3.js visualization or any .html to heroku

10 steps process to deploy a .html website to Heroku, run these commands on the terminal and make sure you have a Heroku account

    1. Get to the directory: cd YOUR_DIRECTORY
    2. Rename the file to home.html: mv index.html home.html
    3. Create index.php with the line:  echo ‘<? include_once(“home.html”);?>’ > index.php
    4. Create empty composer file: echo ‘{}’ > composer.json
    5. git init
    6. sudo git add .
    7. sudo git commit -m “deploying static–err, dynamic site to heroku”
    8. heroku login
    9. login with your credentials
    10. heroku apps: create YOUR_APP_NAME
    11. git push Heroku master
    12. sudo git add .
    13. git commit -m “a helpful message”
    14. git push heroku master

How to Embed D3.js visualizations in WordPress blog using iFrames

You need to do 2 things before Embedding any D3.js visualization to your self-hosted WordPress blog

  1. Install the iFrame plugin for WordPress.
  2. Host your d3.js visualisation somewhere (so that you can access your visualisation through URL, preferably Heroku: 5 minute process)

After you are done with these two steps just use the iframe tag in the text:

<iframe src=”YOUR_COMPLETE_URL” width=”2000″ height=”800″></iframe>

Optional with Frame Border, Margin Width, Margin Height

<iframe src=”YOUR_COMPLETE_URL” width=”2000″ height=”800″ frameborder=”0″ marginwidth=”0″ marginheight=”0″></iframe>

Example: