block by EE2dev 5a4ab3ca8b3b7b57d234

item explorer - data format - example 1

Full Screen

An example of the required format for item explorer. This example consists of the most basic csv file.

More examples

The main example is here.

Complete list of examples:

  1. Data formatting

  2. Including data

  3. Visualization options

index.html

<!DOCTYPE html>	
<meta charset="utf-8">
<head>
  <link rel="stylesheet" type="text/css" href="//www.ankerst.de/lib/itemExplorer_10.css">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.6/d3.min.js"></script>
  <script src="//www.ankerst.de/lib/itemExplorer_10.min.js"></script>
</head>

<body>
  <script>  
    var myIEChart = itemExplorerChart("items_5.csv");
    showChart(); 
    
    function showChart() {
      d3.select("body")
        .append("div")
        .attr("class", "chart")
        .call(myIEChart);
    }   
  </script>
</body>
</html>

items_5.csv

_customers,B-jui,B-wat,B-bee,B-mil,B-win,F-egg,F-cer,F-can,F-mea,F-fis,F-fru,F-veg,F-che,O-flo,O-mag,O-hyg,O-cos
200000,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1,1
100000,1,1,1,1,1,1,1,0,0,0,0,0,0,0,0,0,0
100000,0,0,0,0,0,0,0,1,1,1,1,1,1,1,0,0,0
100000,0,0,0,0,0,0,0,0,0,0,0,0,0,0,1,1,1
100000,0,1,0,1,0,1,0,1,0,1,0,1,0,1,0,1,0