D3js反转图形，y值在9到10之间

Question

所以我用D3动态创建了一堆简单的折线图，一切进展顺利，但由于某些原因，范围从9到9的图表反转并且看起来非常糟糕/无法正常工作。

第一个，值是颠倒的

这个很好......

这是一些代码......

    var dataRange = d3.extent(quoteObjects, function(d){ return d.close });
    var dateRange = d3.extent(quoteObjects, function(d){ return d.date });

    // Set chart variables
    var vis = d3.select("#"+type),
        WIDTH = $('#chart-box').width(),
        HEIGHT = $('#'+type).innerHeight(),
        MARGINS = {
            top: 20,
            right: 20,
            bottom: 20,
            left: 60,
        },
        // set scales
        xScale = d3.time.scale().range([MARGINS.left, WIDTH - MARGINS.right]).domain(dateRange),
        yScale = d3.scale.linear().range([HEIGHT - MARGINS.top, MARGINS.bottom]).domain(dataRange),
        // create displayed axis
        xAxis = d3.svg.axis()
            .scale(xScale)
            .tickValues( xScale.ticks(6) )
        yAxis = d3.svg.axis()
            .scale(yScale)
            .tickValues( yScale.ticks(6) )
            .orient("left");

    console.log("WH", WIDTH, HEIGHT);

    if (type == "intraday"){
        xAxis.tickFormat(d3.time.format("%H"))
    }

    // append x axis
    vis.append("svg:g")
        .attr("class", "axis")
        .attr("transform", "translate(0," + (HEIGHT - MARGINS.top) + ")")
        .call(xAxis);

    // append y axis
    vis.append("svg:g")
        .attr("class", "axis")
        .attr("transform", "translate(" + (MARGINS.left) + ",0)")
        .call(yAxis);

    // create line based on "close" values
    var lineGen2 = d3.svg.line()
      .x(function(d) {
        return xScale(d.date);
      })
      .y(function(d) {
        return yScale(d.close);
      })
      .interpolate("basis");

    // append "close" line
    vis.append('svg:path')
      .attr('d', lineGen2(quoteObjects))
      .attr('stroke', '#931a28')
      .attr('stroke-width', 3)
      .attr('fill', '#222');