title: Syntax error in converting arrays to JSON arrays and create table
body: <p>I have an array of arrays of the following type which is actually very very long:</p>
  
  <p><code>[["Vishnu", 25],["Joginder", 22],["Amar", 27],["Rohan", 24],["Karan", 23]]</code></p>
  
  <p>I first convert them to JSON arrays of the following type:</p>
  
  <pre><code>[
    {
      "Player": "Vishnu",
      "Age": 25
    },
    {
      "Player": "Joginder",
      "Age": 22
    },
    {
      "Player": "Amar",
      "Age": 27
    },
    {
      "Player": "Rohan",
      "Age": 24
    },
    {
      "Player": "Karan",
      "Age": 23
    }
  ]
  </code></pre>
  
  <p>I want to create tables with the help of the asynchronous call d3.json, as the arrays are on another url. I made the following Javascript code</p>
  
  <p><strong>JAVASCRIPT CODE:</strong></p>
  
  <pre><code>    arrayjson = function(ele)
  {
    var item = ele;
    return {"player":item[0], "age": item[1]};
  }
  
  d3.json('json.html', function (error, data){
             var json_data;
             if(error) { alert(error);visualizeit();}
  
             data.map(arrayjson);  
  
  
  function tabulate(data, columns) {
  
          var table = d3.select('body').append('table')
          var thead = table.append('thead')
          var tbody = table.append('tbody');
  
          // append the header row
          thead.append('tr')
            .selectAll('th')
            .data(columns).enter()
            .append('th')
              .text(function (column) { return column; });
  
          // create a row for each object in the data
          var rows = tbody.selectAll('tr')
            .data(data)
            .enter()
            .append('tr');
  
          // create a cell in each row for each column
          var cells = rows.selectAll('td')
            .data(function (row) {
              return columns.map(function (column) {
                return {column: column, value: row[column]};
              });
            })
            .enter()
            .append('td')
              .text(function (d) { return d.value; });
  
        return table;
      }
  
      // render the table(s)
      tabulate(data, ['player', 'age']); // 2 column table
  
  });
  </code></pre>
  
  <p>and the following </p>
  
  <p><strong>HTML code</strong></p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="d3.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="c3.js"&gt;&lt;/script&gt;
  &lt;link rel='stylesheet' href='style.css'&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script type='text/javascript' src='pdisb.js'&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>But I am unable to figure out where I made the mistake. Any suggestion would be appreciated. It says "SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data"</p>