D3.js 使用时间刻度时不渲染D3图形

我是D3新手，我试图得到一个简化的线图示例，使用日期进行渲染，但到目前为止还没有骰子。两个轴上的简单整数工作正常，但移动到时间刻度会破坏它。我读了很多例子，但显然我遗漏了一些基本的东西

另外，我正在使用JSBin进行测试，有人能给我指出正确的方向吗

var h = 100;
var w = 200;

monthlySales = [
  {"month":"2016-01-01", "sales":20},
  {"month":"2016-01-15", "sales":14},
  {"month":"2016-02-10", "sales":20},
  {"month":"2016-03-15", "sales":60}
];

var x = d3.time.scale().domain([minDate, maxDate]).range([0, w]);

var lineFun = d3.svg.line()
  .x(function(d) {return x(getDate(d));})
  .y(function(d) {return h-d.sales;})
  .interpolate("linear");


var svg = d3.select("body").append("svg").attr({
  width:w, height:h
});

var viz = svg.append("path")
  .attr({
    d: lineFun(monthlySales),
    "stroke": "purple",
    "stroke-width": 2,
    "fill": "none"
  });

function getDate(d) {
    var d2 = d3.time.format("%Y-%m-%d").parse(d.month);
    return new Date(d2);
};

// get max and min dates - this assumes data is sorted
var minDate = getDate(monthlySales[0]),
    maxDate = getDate(monthlySales[monthlySales.length-1]);

---

正在使用在该点不存在的起始值和结束值设置比例的域。它不会抛出未设置minDate和maxDate的错误，因为变量声明被提升到顶部。如果你搬家

// get max and min dates - this assumes data is sorted
var minDate = getDate(monthlySales[0]),
    maxDate = getDate(monthlySales[monthlySales.length-1]);

以前

var x = d3.time.scale().domain([minDate, maxDate]).range([0, w]);

---

它应该会起作用

正在使用在该点不存在的起始值和结束值设置标尺的域。它不会抛出未设置minDate和maxDate的错误，因为变量声明被提升到顶部。如果你搬家

// get max and min dates - this assumes data is sorted
var minDate = getDate(monthlySales[0]),
    maxDate = getDate(monthlySales[monthlySales.length-1]);

以前

var x = d3.time.scale().domain([minDate, maxDate]).range([0, w]);

---

它应该会起作用

请提供JSBin URL以便轻松调试。。。我尝试使用codepen，但无法复制请提供JSBin URL以便轻松调试。。。我尝试使用codepen，但无法复制它