问d3:正在缩放的轴，而不是多行图.我怎样才能解决这个问题？

EN

var parseDate = d3.time.format("%d/%m/%Y").parse;
var x = d3.time.scale().range([0, width]);
var y = d3.scale.linear().range([height, 0]);

// Define the axes
var xAxis = d3.svg.axis().scale(x)
.orient("bottom");//.tickSize(-height);

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

// Define the line
var cumulativeline = d3.svg.line()
.interpolate("linear")
.x(function(d) { return x(d.date); })
.y(function(d) { return y(d.cumulative); });

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

svg.append("clipPath")
.attr("id", "clip")
.append("rect")
.attr("width", width)
.attr("height", height);

// Get the data
d3.csv("file.csv", function(error, data) {
data.forEach(function(d) {
    d.date = parseDate(d.date);
    d.cumulative = +d.cumulative;
});

var dataNest = d3.nest()
    .key(function(d) {return d.a_tradeidtype;})
    .entries(data);

x.domain(d3.extent(data, function(d) { return d.date; }));
y.domain([0, d3.max(data, function(d) { return d.cumulative; })]);

// Loop through each a_tradeidtype / key
dataNest.forEach(function(d,i) { 
svg.append("path")
        .style("stroke", function() { // Add the colours dynamically
            return d.color = color(d.key); })
        .attr("class", classname)
        .attr("d", cumulativeline(d.values))
        .attr("clip-path", "url(#clip)");
});

// Add the X Axis
svg.append("g")
    .attr("class", "x axis")
    .attr("transform", "translate(0," + height + ")")
    .call(xAxis);

// Add the Y Axis
svg.append("g")
    .attr("class", "y axis")
    .call(yAxis);

// Create zooming component
var zoom = d3.behavior.zoom()
    .x(x)
    .y(y)
    .scaleExtent([1, 10])
    .on('zoom', zoomed);

svg.call(zoom);
});

function zoomed() {
  svg.select(".x.axis").call(xAxis);
  svg.select(".y.axis").call(yAxis);
}