zeichnen die Punkte x und y, die Achsen y und x werden nicht korrekt angezeigt

Question

Ich versuche, ein Liniendiagramm laden CSV-Dateien durch Platzieren von Punkten auf der X- und Y-Achse zu erstellen. Aus irgendeinem seltsamen Grund werden die Achsen nicht korrekt angezeigt. Ich habe negative Werte für x und y. also sollte es eine kartesische Ebene wie die in diesem Bild haben. In diesem Fall muss die komplette kartesische Ebene angezeigt werden. In meinen Punkten gibt es negative Werte in x und y.

Ich weiß nicht, warum die Punkte falsch zeigen.

die Update-Taste, neue Punkte laden die Werte des Graphen zu aktualisieren.

http://plnkr.co/edit/dDx8gRZIfjvemWpgikAp?p=preview

var margin = {top: 30, right: 20, bottom: 30, left: 50}, 
    width = 600 - margin.left - margin.right, 
    height = 270 - margin.top - margin.bottom; 


// Set the ranges 
var x = d3.scale.linear().range([0, width]); 
var y = d3.scale.linear().range([height, 0]); 

// Define the axes 
var xAxis = d3.svg.axis().scale(x) 
    .orient("bottom").ticks(5); 

var yAxis = d3.svg.axis().scale(y) 
    .orient("left").ticks(5); 

// Define the line 
var valueline = d3.svg.line() 
    .x(function(d) { return x(d.datax); }) 
    .y(function(d) { return y(d.datay); }); 

// Adds the svg canvas 
var svg = d3.select("body") 
    .append("svg") 
     .attr("width", width + margin.left + margin.right) 
     .attr("height", height + margin.top + margin.bottom) 
    .append("g") 
     .attr("transform", 
       "translate(" + margin.left + "," + margin.top + ")"); 

Answer 1

Die negativen Werte in x und y nicht angezeigt, da Ihre Mindest Domain Wert 0:

x.domain([0, d3.max(data, function(d) { return d.datax; })]); 
y.domain([0, d3.max(data, function(d) { return d.datay; })]); 

Es sollte (gewesen, so dass es setzt den Minimalwert Datensatz als Domänen Minimum)

x.domain(d3.extent(data, function(d) { return d.datax; })); 
y.domain(d3.extent(data, function(d) { return d.datay; })); 

Arbeitscode here