Why can't i get this working?

What am i missing?

Trying to get my x function working correctly here and i get NaNs back... help!?

For the record, my dates are coming from JSON.NET so that's why they look the way they do.

i'm trying to follow this d3 line chart example

Found it!

The issue was the weird dates coming back from ASP.NET. See this discussion

<html>
  <head>
    <style type="text/css">
        .chart rect {
            stroke: white;
            fill: steelblue;
        }
        
        .line {
            fill: none;
            stroke: steelblue;
            stroke-width: 1.5px;
        }
    </style>
</head>
<body>
   <svg class="chart" width="800" height="200">
   </svg>
  <script src="https://d3js.org/d3.v2.js"></script>
  <script>
    var data = [
    [
        "/Date(1354802434000-0500)/",
        255356
    ],
    [
        "/Date(1354712413000-0500)/",
        384524
    ],
    [
        "/Date(1354626039000-0500)/",
        416284
    ],
    [
        "/Date(1354111259000-0500)/",
        324204
    ],
    [
        "/Date(1353934819000-0500)/",
        507864
    ],
    [
        "/Date(1353675620000-0500)/",
        390408
    ],
    [
        "/Date(1353589201000-0500)/",
        374528
    ],
    [
        "/Date(1353527136000-0500)/",
        362348
    ],
    [
        "/Date(1352728811000-0500)/",
        363308
    ],
    [
        "/Date(1352383213000-0500)/",
        339404
    ]
];

data = data.map(function(element) {
    var startTimeISO8601 = d3.time.format.utc(Date(element[0]))
    return [startTimeISO8601, element[1]]
  })

// Create the margins for the stuff!
  var margin = { top: 20, right: 20, bottom: 30, left: 50 },
    width = 800 - margin.left - margin.right,
    height = 200 - margin.top - margin.bottom;

var x = d3.scale.linear()
    .domain([0, data.length])
    .range([0, width])

// Time x scale
  // Set up the x scale
  var xExtent = d3.extent(data, function (d) {
      return d[0]
  })

var x = d3.time.scale()
    .domain(xExtent)
    .range([0, width])

// Set up the y scale
  var yExtent = d3.extent(data, function (d) {
    return d[1]
  })

var y = d3.scale.linear()
    .domain(yExtent)
    .range([height, 0])

// The line function where the x and y values are calculated
  var line = d3.svg.line()
    .x(function (d, i) {
      return x(d[0])
    })
    .y(function (d) {
      return y(d[1])
    })

// ## Chart
  var svg = d3.select('svg')
      .attr('class', 'chart')
      .attr('width', 800)
      .attr('height', 200)
    .append('g')
      .attr("transform", "translate(" + margin.left + "," + margin.top + ")"); // ?

// Add the data into the chart element
  svg.append('path')
    .datum(data)
    .attr('class', 'line')
    .attr('d', line)

</script>
</body>
</html>

Modified http://d3js.org/d3.v2.js to a secure url

https://d3js.org/d3.v2.js