Question

我尝试使用d3创建条形图，一切正常，但我的X轴没有周末数据，自然我在条形图之间有一些空格。

谁知道如何摆脱它们？

我如何渲染条

return values(stack).map((d, index) =>
          <rect key={index} clipPath="url(#gf)"
             className={`bar ${d.y < 0 ? 'negative' : 'positive'}`}
             style={{fill: color(stack.label)}}
             data-legend={stack.key}
             x={x(d.x) + ((xScale.rangeBand() * seriesIndex) / data.length)}
             y={d.y < 0 ? _yScale(0) : _yScale(d.y)}
             width={width <= 0 ? 2 : width}
             height={Math.abs(_yScale(d.y) - _yScale(0))}
          ></rect>
);

变量：

this.state = {
  ...
  x: d3.time.scale(),
  y: d3.scale.linear(),
  ...
};

x.range([0, this.xScaleWidth])
   .domain(this.calculateDomain(data, 'x'));

const xScale = d3.scale.ordinal()
   .domain(values(stack).map(e => { return e.x; }))
   .rangeRoundBands([0, this.xScaleWidth], 0.4, 0);

const width = xScale.rangeBand() / data.length;

const _yScale = d3.scale.linear()
   .domain(yDomain)
   .range([this.props.dim.height, 0])
   .nice();

我做错了什么？

带条形图的日期刻度

0 个答案: