CODEWITHSUNDEEP
javascriptgithubd3.jsmarkdowngithub-pages
lollercoaster
lollercoaster

Reputation: 16513

github pages serve javascript / d3 visualizations

I'd like to serve javascript scripts and have them run such that people can go to my *.github.io page and see the visualizations there.

Is this possible? If so, how might I embed the javascript into the markdown?

Upvotes: 7

Views: 2582

Answers (2)

jshanley
jshanley

Reputation: 9128

From the Markdown Syntax Overview:

For any markup that is not covered by Markdown’s syntax, you simply use HTML itself. There’s no need to preface it or delimit it to indicate that you’re switching from Markdown to HTML; you just use the tags.

I'm sure there's a better way to include scripts in your project, but if you really want to embed them in your markdown, there shouldn't be anything stopping you from doing the following:

# This is a title

> this is a blockquote

<script>
  // this is a script that renders a chart
  var chart = d3.select('body').append('svg')
     // ...etc...
</script>

Upvotes: 8

goblin-esque
goblin-esque

Reputation: 465

Sounds like you want to set up a bl.ocks:

This is a simple viewer for code examples hosted on GitHub Gist. Code up an example using Gist, and then point people here to view the example and the source code, live!

The main source code for your example should be named index.html. You can also include a README.md using Markdown, and a thumbnail.png for preview. The index.html can use relative links to other files in your Gist; you can also use absolute links to shared files, such as D3, jQuery and Leaflet.

Otherwise, you can embed stuff using <iframe>.

Upvotes: 3

Related Questions