d3.js使用键修饰符进行缩放

Question

我现在正在寻找一些时间来允许在d3.js图表​​上放大X / Y中的一个或另一个（或两个）方向。这是我的简单图表：

      var margin = parseInt(attrs.margin) || {top: 20, right: 20, bottom: 20, left: 20},
          padding = parseInt(attrs.padding) || 30;

      var svg = d3.select(ele[0]).append('svg')
            .style('width', '100%');

      var width = 960 - margin.left - margin.right - padding,
            height = 500 - margin.top - margin.bottom;

        // X scale
        var x = d3.scale.linear().domain([d3.min(data, function(d){return d.x;}), d3.max(data, function(d){return d.x})]).range([0, width]);

        // Y scale
        var y = d3.scale.linear().domain([0, d3.max(data, function(d){return d.y;})]).range([height, 0]);

        svg.call(d3.behavior.zoom().x(x).y(x).on("zoom", zoomed));

        // create a line function that can convert data[] into x and y points
        var line = d3.svg.line()
             .interpolate("basis")
             // assign the X function to plot our line as we wish
             .x(function(d,i) { return x(d.x); })
             .y(function(d) { return y(d.y); });

        // Add an SVG element with the desired dimensions and margin.
        svg.attr("width", width + margin.left + margin.right + padding)
           .attr("height", height + margin.top + margin.bottom);

        var g = svg.append("g").attr("transform", "translate(60," + margin.top + ")");

         // create Axis
        var xAxis = d3.svg.axis().scale(x).orient("bottom");
        var yAxis = d3.svg.axis().scale(y).orient("left");

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

        // Add the y-axis to the left
        g.append("g")
                .attr("class", "y axis")
                .attr("transform", "translate(" + 0 +",0)")
                .call(yAxis);

        // objects for the zooming clipping
        var clip = g.append("clipPath")
             .attr("id", "clip")
             .append("rect")
             .attr("x", 0)
             .attr("y", 0)
             .attr("width", width)
             .attr("height", height);

        var chartBody = g.append("g")
             .attr("clip-path", "url(#clip)");

        chartBody.append("path")
             .datum(data)
             .attr("class", "line")
             .attr("d", line);

        function zoomed() {
            svg.select(".x.axis").call(xAxis);
            svg.select(".y.axis").call(yAxis);
            svg.select(".line")   
               .attr("class", "line")
               .attr("d", line);
        }

有什么方法可以在缩放时使用按键修改器（例如当转换+鼠标滚轮时，只能缩放X）？