block by jfsiii 69e21669531720ca960ed77bcbfb693c

fromCSV() example

Full Screen

This example shows how to use fromCSV() to convert a CSV file into JSON-stat so it can be then processed by the JSON-stat Javascript Toolkit.

forked from badosa‘s block: fromCSV() example

index.html

<!DOCTYPE html>
<!--[if lt IE 7]><html class="lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]><html class="lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]><html class="lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html> <!--<![endif]-->
<head>
  <title>Visual + JSON-stat: line chart from CSV</title>
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />

  <!-- DO NOT DO THIS IN PRODUCTION -->
  <!-- github.io and json-stat.org ARE NOT CDNs! Link to your own copies or to a CDN. -->
  <link href="//idescat.github.io/visual/visual.css" rel="stylesheet" type="text/css" />
  <script src="//json-stat.org/lib/json-stat.js?0.10.1"></script>
  <script src="//json-stat.org/lib/json-stat.utils.js?2.1.4"></script>
  <script src="//idescat.github.io/visual/lazyvisualsetup.js"></script>
  <!-- /DO NOT DO THIS IN PRODUCTION -->

  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
</head>

<body>
  <section id="visual" class="visual"></section>

  <script>
  $.ajax( { url: "data.csv" } )
    .done(function( csv ) {
      var
        ds=JSONstat( JSONstatUtils.fromCSV( csv ) ),
        cpi=ds.Data( { "contents" : "12-month rate (per cent)" }, false ),
        time=ds.Dimension( "time" ).id.map( function( t ){
          return t.replace( /M/, "" );
        });
      ;

      visual({
        lang: "en",
        title: "Consumer Price Index",
        footer: "Source: Statistics Norway. Dataset 1086.",
        geo: "Norway",
        unit: { "symbol" : "%" },
        grid: { point: 0, shadow: 0 },
        axis: { x: false },
        dec: 1,
        type: "tsline",
        time: time,
        data: [ { label: "12-month rate", val: cpi } ]
      });
    });
    </script>
  </body>
</html>