需要隐藏或删除 d3 图表中的替代 x 轴值

var data = [{
    label: "Data Set 1",x: [0,1,2,3,4],y: [0,4]
  },{
    label: "Data Set 2",4,9,16]
  }
];
var xy_chart = d3_xy_chart()
  .width(960)
  .height(500)
  .xlabel("X Axis")
  .ylabel("Y Axis");
var svg = d3.SELEct("body").append("svg")
  .datum(data)
  .call(xy_chart);

function d3_xy_chart() {
  var width = 640,height = 480,xlabel = "X Axis Label",ylabel = "Y Axis Label";

  function chart(SELEction) {
    SELEction.each(function(datasets) {
      //
      // Create the plot. 
      //
      var margin = {
          top: 20,right: 80,bottom: 30,left: 50
        },innerwidth = width - margin.left - margin.right,innerheight = height - margin.top - margin.bottom;

      var x_scale = d3.scale.linear()
        .range([0,innerwidth])
        .domain([d3.min(datasets,function(d) {
            return d3.min(d.X);
          }),d3.max(datasets,function(d) {
            return d3.max(d.X);
          })
        ]);

      var y_scale = d3.scale.linear()
        .range([innerheight,0])
        .domain([d3.min(datasets,function(d) {
            return d3.min(d.y);
          }),function(d) {
            return d3.max(d.y);
          })
        ]);

      var color_scale = d3.scale.category10()
        .domain(d3.range(datasets.length));

      var x_axis = d3.svg.axis()
        .scale(x_scalE)
        .orient("bottom")
        .tickFormat(d => d % 1 ? d : null);

      var y_axis = d3.svg.axis()
        .scale(y_scalE)
        .orient("left");

      var x_grid = d3.svg.axis()
        .scale(x_scalE)
        .orient("bottom")
        .tickSize(-innerheight)
        .tickFormat("");

      var y_grid = d3.svg.axis()
        .scale(y_scalE)
        .orient("left")
        .tickSize(-innerwidth)
        .tickFormat("");

      var draw_line = d3.svg.line()
        .interpolate("basis")
        .x(function(d) {
          return x_scale(d[0]);
        })
        .y(function(d) {
          return y_scale(d[1]);
        });

      var svg = d3.SELEct(this)
        .attr("width",width)
        .attr("height",height)
        .append("g")
        .attr("transform","translate(" + margin.left + "," + margin.top + ")");

      svg.append("g")
        .attr("class","x grid")
        .attr("transform","translate(0," + innerheight + ")")
        .call(x_grid);

      svg.append("g")
        .attr("class","y grid")
        .call(y_grid);

      svg.append("g")
        .attr("class","x axis")
        .attr("transform"," + innerheight + ")")
        .call(x_axis)
        .append("text")
        .attr("dy","-.71em")
        .attr("x",innerwidth)
        .style("text-anchor","end")
        .text(xlabel);

      svg.append("g")
        .attr("class","y axis")
        .call(y_axis)
        .append("text")
        .attr("transform","rotate(-90)")
        .attr("y",6)
        .attr("dy","0.71em")
        .style("text-anchor","end")
        .text(ylabel);

      var data_lines = svg.SELEctAll(".d3_xy_chart_line")
        .data(datasets.map(function(d) {
          return d3.zip(d.x,d.y);
        }))
        .enter().append("g")
        .attr("class","d3_xy_chart_line");

      data_lines.append("path")
        .attr("class","line")
        .attr("d",function(d) {
          return draw_line(d);
        })
        .attr("stroke",function(_,i) {
          return color_scale(i);
        });

      data_lines.append("text")
        .datum(function(d,i) {
          return {
            name: datasets[i].label,final: d[d.length - 1]
          };
        })
        .attr("transform",function(d) {
          return ("translate(" + x_scale(d.final[0]) + "," +
            y_scale(d.final[1]) + ")");
        })
        .attr("x",3)
        .attr("dy",".35em")
        .attr("fill",i) {
          return color_scale(i);
        })
        .text(function(d) {
          return d.name;
        });

    });
  }

  chart.width = function(value) {
    if (!arguments.length) return width;
    width = value;
    return chart;
  };

  chart.height = function(value) {
    if (!arguments.length) return height;
    height = value;
    return chart;
  };

  chart.xlabel = function(value) {
    if (!arguments.length) return xlabel;
    xlabel = value;
    return chart;
  };

  chart.ylabel = function(value) {
    if (!arguments.length) return ylabel;
    ylabel = value;
    return chart;
  };

  return chart;
}

body {
  font: 10px sans-serif;
}

.axis path,.axis line {
  fill: none;
  stroke: #000;
  shape-rendering: crispEdges;
}

.grid path,.grid line {
  fill: none;
  stroke: rgba(0,0.25);
  shape-rendering: crispEdges;
}

.x.axis path {
  display: none;
}

.line {
  fill: none;
  stroke-width: 2.5px;
}

<script src="https://cdnjs.cloudFlare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>