title: How to make Javascript output brackets for an Array of Arrays. (For Highcharts)
body: <p>Hi I'm using highcharts and I'm trying to create an array of arrays on the fly to feed to the chart.</p>
  
  <p>I figured out how to make the array of arrays but the output format is not what highcharts wants to be fed.</p>
  
  <p>I'm trying to generate an array on the fly where the output will be:</p>
  
  <p>[[10, 3500], [11, 3400], [12, 3300], [13, 3200], [14, 3100], [15, 3000], [16, 2900], [17, 2800], [18, 2700], [19, 2600], [20, 2500]]</p>
  
  <p>BUT what I get is this:</p>
  
  <p>10,3500,11,3400,12,3300,13,3200,14,3100,15,3000,16,2900,17,2800,18,2700,19,2600,20,2500</p>
  
  <p>How do you get Javascript to output the brackets so the format will be correct?</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  
    Max Price: &lt;input id="max_price_input" type="number" value=3500&gt;&lt;br&gt;
    Min Price: &lt;input id="min_price_input" type="number" value=2500&gt;&lt;br&gt;
    Max People: &lt;input id="max_people_input" type="number" value=20&gt;&lt;br&gt;
    Min People: &lt;input id="min_people_input" type="number" value=10&gt;&lt;br&gt;
  
  
  &lt;script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;
  &lt;script src="http://code.highcharts.com/highcharts.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  
  chart = void 0;
  
  $(document).ready(function() {
      var max_price, min_price, max_people, min_people, chart;
      max_price=document.getElementById("max_price_input").value;
      min_price=document.getElementById("min_price_input").value;
      max_people=document.getElementById("max_people_input").value;
      min_people=document.getElementById("min_people_input").value;
  
      var price_change = max_price - min_price;
      var steps = max_people - min_people;
      var price_step = price_change*1.0/steps;
      var price = max_price;
      var people = 10;
      var priceArray = [];
  
          for (var i=0;i&lt;=steps;i++)
      { 
          priceArray[i] = [];
                  priceArray[i][0] = [people, price];
          price-=price_step;
          people+=1
      }
  
  document.getElementById("price_steps").innerHTML=priceArray
  
    return chart = new Highcharts.Chart({
  
      chart: {
        renderTo: "chart",
        type: "spline"
      },
      title: {
        text: "Dynamic Price Chart"
      },
      xAxis: {
        title: {
          text: "People"
        }
      },
      yAxis: {
        plotLines: [
          {
            color: "#FF0000",
            width: 2,
            value: 0
          }
        ],
        title: {
          text: "Price"
        }
      },
      tooltip: {
        formatter: function() {
          return "People: " + this.x + "&lt;br/&gt; Price: " + this.y;
        }
      },
      series: [
        {
          name: "Price",
          data: priceArray
        }
      ]
    });
  });
  
  &lt;/script&gt;
  </code></pre>