const _arc = edge => { const draw = line().curve(curveBasis); const midX = (edge.source.x + edge.target.x) / 2; const midY = (edge.source.x - edge.target.x) * 2; return draw([[edge.source.x, 0], [midX, midY], [edge.target.x, 0]]); }
_createGuides() { if (!this.ticksY) { return null; } const lines = this.ticksY // don't draw guide line for 0s .filter(t => t) .map((tick) => { return d3.shape.line() .x((d) => this.scaleX(moment(d[0]).toDate())) .y((d) => -this.scaleY(d[1])) ([ [this.extentX[0], tick], [this.extentX[1], tick] ]) }) ; return lines; }
constructor(props) { super(props); this.margin = { top: 20, right: 20, bottom: 50, left: 0 }; this.renderingWidth = this.props.graphWidth - this.margin.left - this.margin.right; this.renderingheight = this.props.graphHeight - this.margin.top - this.margin.bottom; this.x = d3.scaleTime() .range([0, this.renderingWidth]); this.y = d3.scaleLinear() .rangeRound([this.renderingheight, 0]); this.line = d3.line() .x(d => this.x(d.date)) .y(d => this.y(d.price)); }
function createLine({ data, curve = d3Shape.curveLinear }): string { return d3Shape.line().curve(curve)(data); }
d3.line() .x(x) .y(d => linear(weierstrass(d)))
function createLine({ data, curve = d3Shape.curveLinear }): string { return d3Shape.line().curve(curve)(data); }