<?xml version="1.0" encoding="UTF-8"?> <rss
version="2.0"
xmlns:content="http://purl.org/rss/1.0/modules/content/"
xmlns:wfw="http://wellformedweb.org/CommentAPI/"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:atom="http://www.w3.org/2005/Atom"
xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
><channel><title>Datavisualization.ch &#187; HTML5</title> <atom:link href="http://datavisualization.ch/tag/html5/feed/" rel="self" type="application/rss+xml" /><link>http://datavisualization.ch</link> <description>Datavisualization.ch is the premier news and knowledge resource for data visualization and infographics.</description> <lastBuildDate>Wed, 01 Feb 2012 07:23:31 +0000</lastBuildDate> <language>en</language> <sy:updatePeriod>hourly</sy:updatePeriod> <sy:updateFrequency>1</sy:updateFrequency> <generator>http://wordpress.org/?v=3.3.1</generator> <item><title>The Evolution of the Web</title><link>http://datavisualization.ch/showcases/the-evolution-of-the-web/</link> <comments>http://datavisualization.ch/showcases/the-evolution-of-the-web/#comments</comments> <pubDate>Fri, 02 Sep 2011 07:30:01 +0000</pubDate> <dc:creator>Benjamin Wiederkehr</dc:creator> <category><![CDATA[Showcases]]></category> <category><![CDATA[Google]]></category> <category><![CDATA[HTML5]]></category> <category><![CDATA[Internet]]></category><guid
isPermaLink="false">http://datavisualization.ch/?p=8232</guid> <description><![CDATA[The folks over at Google Chrome  have teamed up with Hyperakt and Vizzuality to put together the 2011 version of the Evolution of the Web visualization.]]></description> <content:encoded><![CDATA[<a
href='http://datavisualization.ch/showcases/the-evolution-of-the-web/' title='The Evolution of the Web' class='share_image'><img
src='http://datavisualization.ch/wp-content/uploads/2011/09/evolutionoftheweb_01.png' title='The Evolution of the Web' alt='The Evolution of the Web' /></a><p>The folks over at <a
href="http://chrome.blogspot.com/" target="_blank">Google Chrome</a>  have teamed up with <a
href="http://hyperakt.com/" target="_blank">Hyperakt</a> and <a
href="http://www.vizzuality.com/" target="_blank">Vizzuality</a> to put together the 2011 version of the <a
href="http://evolutionofweb.appspot.com/">Evolution of the Web</a> visualization. It&#8217;s an interactive timeline that shows how the current web technologies have evolved over time. The color bands in the visualization represent the interaction between web technologies like HTML5, CSS3 and WebGL and browsers that we use daily. Screenshots from past versions of todays browsers are a nice addition (Mosaic 1.0 anyone?). As you would expect, it&#8217;s all built using purely open web technologies and the data is provided by <a
href="http://www.wikipedia.org/" target="_blank">Wikipedia</a> and <a
href="http://caniuse.com/" target="_blank">CanIUse</a>.</p><p><img
class="alignnone size-full wp-image-8241" title="evolutionoftheweb_02" src="http://datavisualization.ch/wp-content/uploads/2011/09/evolutionoftheweb_02.png" alt="" width="710" height="425" /><img
class="alignnone size-full wp-image-8242" title="evolutionoftheweb_03" src="http://datavisualization.ch/wp-content/uploads/2011/09/evolutionoftheweb_03.png" alt="" width="710" height="425" /><img
class="alignnone size-full wp-image-8237" title="evolutionoftheweb_04" src="http://datavisualization.ch/wp-content/uploads/2011/09/evolutionoftheweb_04.png" alt="" width="710" height="425" /></p> ]]></content:encoded> <wfw:commentRss>http://datavisualization.ch/showcases/the-evolution-of-the-web/feed/</wfw:commentRss> <slash:comments>6</slash:comments> </item> <item><title>Peoplemovin Visualizes Migration Flows</title><link>http://datavisualization.ch/showcases/peoplemovin-visualizes-migration-flows/</link> <comments>http://datavisualization.ch/showcases/peoplemovin-visualizes-migration-flows/#comments</comments> <pubDate>Mon, 13 Jun 2011 09:32:11 +0000</pubDate> <dc:creator>Benjamin Wiederkehr</dc:creator> <category><![CDATA[Showcases]]></category> <category><![CDATA[Anthropology]]></category> <category><![CDATA[HTML5]]></category><guid
isPermaLink="false">http://datavisualization.ch/?p=7940</guid> <description><![CDATA[Peoplemovin, an experimental project in data visualization by Carlo Zapponi, that shows the flows of 215,738,321 migrants as of 2010 through the use of open data.]]></description> <content:encoded><![CDATA[<a
href='http://datavisualization.ch/showcases/peoplemovin-visualizes-migration-flows/' title='Peoplemovin Visualizes Migration Flows' class='share_image'><img
src='http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_01.png' title='Peoplemovin Visualizes Migration Flows' alt='Peoplemovin Visualizes Migration Flows' /></a><p><a
href="http://peoplemov.in/">Peoplemovin</a>, an experimental project in data visualization by Carlo Zapponi, that shows the flows of 215,738,321 migrants as of 2010. The migration data provided by <a
href="http://data.worldbank.org/">The World Bank</a> is plotted as a flow chart that connects emigration and destination countries. The chart is split in two columns, the emigration countries on the left and the destination countries on the right. The thickness of the lines connecting the countries represents the amount of immigrated people and the color code from blue to red puts the countries in comparison to the rest of the world. The visualization is built in HTML5 using the canvas element and should run fine in most modern browsers.</p><div
class="slider"><img
class="alignnone size-full wp-image-7944" title="peoplemovin_02" src="http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_02.png" alt="" width="710" height="919" /><img
class="alignnone size-full wp-image-7945" title="peoplemovin_03" src="http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_03.png" alt="" width="710" height="919" /><img
class="alignnone size-full wp-image-7946" title="peoplemovin_04" src="http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_04.png" alt="" width="710" height="919" /><img
class="alignnone size-full wp-image-7947" title="peoplemovin_05" src="http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_05.png" alt="" width="710" height="919" /><img
class="alignnone size-full wp-image-7948" title="peoplemovin_06" src="http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_06.png" alt="" width="710" height="919" /></div> <img
src='http://datavisualization.ch/wp-content/uploads/2011/06/peoplemovin_source.png' title='Submitter of Peoplemovin Visualizes Migration Flows' alt='Submitter of Peoplemovin Visualizes Migration Flows' />Carlo Zapponi is  an interaction designer and currently Senior Technologist at <a
href="http://www.frogdesign.com/">frog</a>. Find him on Twitter as <a
href="https://twitter.com/#!/littleark">@littleark</a> or visit his website <a
href="http://www.makinguse.com">makinguse.com</a>.]]></content:encoded> <wfw:commentRss>http://datavisualization.ch/showcases/peoplemovin-visualizes-migration-flows/feed/</wfw:commentRss> <slash:comments>4</slash:comments> </item> <item><title>Dribbble Explained</title><link>http://datavisualization.ch/showcases/dribbble-explained/</link> <comments>http://datavisualization.ch/showcases/dribbble-explained/#comments</comments> <pubDate>Fri, 23 Jul 2010 07:38:09 +0000</pubDate> <dc:creator>Benjamin Wiederkehr</dc:creator> <category><![CDATA[Showcases]]></category> <category><![CDATA[CSS3]]></category> <category><![CDATA[HTML5]]></category> <category><![CDATA[Infographic]]></category><guid
isPermaLink="false">http://datavisualization.ch/?p=5799</guid> <description><![CDATA[Do you know Dribbble? No, not the verb "to dribble" with a typo, but a nifty content sharing site for creatives who show and tell in 120,000 pixels or less. If you're unfamiliar with it, here's how it works.]]></description> <content:encoded><![CDATA[<a
href='http://datavisualization.ch/showcases/dribbble-explained/' title='Dribbble Explained' class='share_image'><img
src='http://datavisualization.ch/wp-content/uploads/2010/07/dribble_infographic_01.png' title='Dribbble Explained' alt='Dribbble Explained' /></a><p>Do you know Dribbble? No, not the verb <em>to dribble</em> with a typo, but a nifty <a
href="http://dribbble.com/">content sharing site</a> for creatives who show and tell in 120,000 pixels or less. If you&#8217;re unfamiliar with it, here&#8217;s how it works.</p><p><a
href="http://www.4muladesign.com/">Jamie Brightmore</a>, creative designer based in the Cotswolds, UK created <a
title="An interactive infographic featuring Dribbble" href="http://lab.4muladesign.com/dribbble/">this interactive infographic</a> to explain the concept and lingo behind Dribbble. While the used visualization methods may not be the best suited to communicate the &#8220;data&#8221;, Jamie uses HTML5 and CSS3 to make the visual interactive and explores the possibilities of these new techniques. An interesting approach that admittedly has it&#8217;s limitations (browser compatibility for example) but also shows some of the potential behind it.</p><p><a
href="http://lab.4muladesign.com/dribbble/"><img
class="alignnone size-full wp-image-5851" title="Dribbble.com Infographic" src="http://datavisualization.ch/wp-content/uploads/2010/07/dribble_infographic.png" alt="Dribbble.com Infographic" width="710" height="1767" /></a></p><p>It served him at least to get one of the much sought-after invites to the platform. By the way, I am looking for an invite, too. So, if somebody got one to share—I would be more than happy! Thanks to @<a
rel="nofollow" href="http://twitter.com/Gulopine">Gulopine</a> for the invite!</p> ]]></content:encoded> <wfw:commentRss>http://datavisualization.ch/showcases/dribbble-explained/feed/</wfw:commentRss> <slash:comments>2</slash:comments> </item> <item><title>Visualize Data in HTML5 with HumbleFinance</title><link>http://datavisualization.ch/tools/visualize-data-in-html5-with-humblefinance/</link> <comments>http://datavisualization.ch/tools/visualize-data-in-html5-with-humblefinance/#comments</comments> <pubDate>Mon, 15 Mar 2010 18:50:37 +0000</pubDate> <dc:creator>Jeremy Stucki</dc:creator> <category><![CDATA[Tools]]></category> <category><![CDATA[HTML5]]></category> <category><![CDATA[JavaScript]]></category><guid
isPermaLink="false">http://datavisualization.ch/?p=4926</guid> <description><![CDATA[Humble software development released a new visualization library called HumbleFinance. It is inspired by the Domestic Trends visualization of Google Finance, but uses pure JavaScript instead of Flash to display the data.]]></description> <content:encoded><![CDATA[<a
href='http://datavisualization.ch/tools/visualize-data-in-html5-with-humblefinance/' title='Visualize Data in HTML5 with HumbleFinance' class='share_image'><img
src='http://datavisualization.ch/wp-content/uploads/2010/03/humblefinance_01.png' title='Visualize Data in HTML5 with HumbleFinance' alt='Visualize Data in HTML5 with HumbleFinance' /></a><p><a
href="http://www.humblesoftware.com/">Humble software development</a> released a new visualization library called <a
href="http://www.humblesoftware.com/finance/index">HumbleFinance</a>. It is visually and functionally inspired by the <a
href="http://www.google.com/finance?q=GOOGLEINDEX_US:ADVERT">Domestic Trends visualization of Google Finance</a>. Unlike Google&#8217;s version, which uses Flash, it is written entirely in JavaScript and uses HTML5&#8242;s canvas tag, so no Plug-In is required to display the visualization.</p><p>Although the HumbleFinance graph is especially suited to display financial time series, any two two-dimensional sets of numerical data which share an axis can be displayed.</p><p>The graph is divided in three areas: On top a section of the data sets can be compared side by side. At the bottom an overview over one data set is displayed. It also supports full interactivity, i.e. hovering over a data point in the demo shows connected points and the associated data. You can also scrub through the timeline and zoom the section of the data.</p><p><a
title="Humble Finance Demo" href="http://www.humblesoftware.com/finance/index#finance" target="_blank"><img
class="alignnone size-full wp-image-4930" title="humblefinance" src="http://datavisualization.ch/wp-content/uploads/2010/03/humblefinance.png" alt="" width="710" height="362" /></a></p> ]]></content:encoded> <wfw:commentRss>http://datavisualization.ch/tools/visualize-data-in-html5-with-humblefinance/feed/</wfw:commentRss> <slash:comments>3</slash:comments> </item> </channel> </rss>
<!-- Performance optimized by W3 Total Cache. Learn more: http://www.w3-edge.com/wordpress-plugins/

Minified using disk: basic
Page Caching using disk: enhanced (User agent is rejected)
Database Caching 15/33 queries in 0.074 seconds using disk: basic

Served from: datavisualization.ch @ 2012-02-09 01:39:15 -->
