So we've seen a bit more data visualisation showing up on this site, and I was wondering if it might be possible to free up the editor a bit to take advantage of this. I know
zin
wants tables, but I want graphs and things. There's packages like
Tableau, for example, that provide a spiffy JS/Ajax visualisation environment, but embedding a Tableau viz can't be done with the limitations on the editor as it currently exists. I reckon it's not trivial (or necessarily a good idea) to let us start writing stuff in script tags and the like.
On the other hand, if you look at the embed code for a chart like this:
http://public.tableausoftware.com/views/premierleaguing/TottenhamPossession?:embed=y
Code:
<script type="text/javascript" src="http://public.tableausoftware.com/javascripts/api/viz_v1.js"></script><div class="tableauPlaceholder" style="width:654px; height:629px;"><noscript><a href="#"><img alt="Tottenham Possession " src="http://public.tableausoftware.com/static/images/pr/premierleaguing/TottenhamPossession/1_rss.png" style="border: none" /></a></noscript><object class="tableauViz" width="654" height="629" style="display:none;"><param name="host_url" value="http%3A%2F%2Fpublic.tableausoftware.com%2F" /><param name="site_root" value="" /><param name="name" value="premierleaguing/TottenhamPossession" /><param name="tabs" value="no" /><param name="toolbar" value="yes" /><param name="static_image" value="http://public.tableausoftware.com/static/images/pr/premierleaguing/TottenhamPossession/1.png" /><param name="animate_transition" value="yes" /><param name="display_static_image" value="yes" /><param name="display_spinner" value="yes" /><param name="display_overlay" value="yes" /><param name="display_count" value="yes" /></object></div><div style="width:654px;height:22px;padding:0px 10px 0px 0px;color:black;font:normal 8pt verdana,helvetica,arial,sans-serif;"><div style="float:right; padding-right:8px;"><a href="http://www.tableausoftware.com/public?ref=http://public.tableausoftware.com/views/premierleaguing/TottenhamPossession" target="_blank">Powered by Tableau</a></div></div>
You see it's pretty straightforward. The only really important part is the name of this specific chart, "premierleaguing/TottenhamPossession", which is used to fill out the urls for the static images as well as the actual interactive chart. The other variables, like the fonts or size or whatever, can be set externally (as in, by
Admin
).
As such, it'd be possible to paste in the share link (given above), have the editor strip out "
http://public.tableausoftware.com/views/" from the head and "?:embed=y" from the tail, and then create a kind of bbcode thing like what we have for youtube and twitter:
Code:
[media="tableau"]premierleaguing/TottenhamPossession[/media]
Then the rendering engine (or whatever) pastes this variable into the master "Tableau embed" template in the four places it's called for (and can even fill in the alt tag for the noscript img).