TypeScript d3.min函數代碼示例

    private draw(): void {
        var xMin = d3.min(this._points, p => p[0]);
        var xMax = d3.max(this._points, p => p[0]);
        var yMin = d3.min(this._points, p => p[1]);
        var yMax = d3.max(this._points, p => p[1]);

        var lineGenerator = d3.svg.line()
            .x(d => this._scale(d[0]))
            .y(d => this._scale(d[1]));
        var path = this._group
            .append('path')
            .attr('d', lineGenerator(this._points))
            .attr({
                fill: this._color
            });
        this._group
            .append('text')
            .attr({
                'transform': `translate(${this._scale((xMax + xMin) / 2)},${this._scale((yMax + yMin) / 2)})`
            })
            .style({
                'text-transform': 'uppercase',
                'text-anchor': 'middle'
            })
            .text(this._name);
    }

    public min(name?: string): number {
        var matrix: IDatum[][] = [];

        if (name != undefined && name != "" && this._chart.stackType === StackType.None) {
            matrix = this.getMatricesByAxisName(name);
        }

        if (matrix.length === 0) {
            matrix = this._matrix;
        }

        if (this._chart.stackType != StackType.None && this.items.length > 1) { // can only be stacked if you have more than 1 series defined
            return d3.min(matrix, function (array: IDatum[]): number {
                return d3.min(array, function (d: IDatum): number {
                    return d.sum + d.y;
                });
            });
        }
        else {
            return d3.min(matrix, function (array: IDatum[]): number {
                return d3.min(array, function (d: IDatum): number {
                    if (d.y != undefined && d.y < d.y0) {
                        return d.y;
                    }
                    return d.y0;
                });
            });
        }
    }

  // Compute a minimum bounding box for a supplied collection of boxes.
  static boundingBox(...boxes: Box[]): Box {
    if (_.isEmpty(boxes)) {
      return null;
    }

    const left = d3.min(boxes, b => b.left());
    const top = d3.min(boxes, b => b.top());
    const right = d3.max(boxes, b => b.right());
    const bottom = d3.max(boxes, b => b.bottom());
    return new Box(left, top, right - left, bottom - top);
  }

 return d3.min(matrix, function (array: IDatum[]): number {
     return d3.min(array, function (d: IDatum): number {
         if (d.y != undefined && d.y < d.y0) {
             return d.y;
         }
         return d.y0;
     });
 });

  render() {

    if (!this.data && this.data.length === 0) {
      return;
    }

    /************************************************************
     * Set Data
     ***********************************************************/

    this.radius = d3.min([this.chartWidth, this.chartHeight]) / 2;

    this.arc = d3.svg.arc()
      .outerRadius(this.radius - 10)
      .innerRadius(0);

    this.color
      .range(pick(this.data, 'color'))
      .domain(pick(this.data, 'label'));

    let arcs = this.pieContainer
      .selectAll('.arc')
      .data(this.pie(this.data));

    /************************************************************
     * D3 Enters
     ***********************************************************/

    this.pieContainer
      .attr('transform', `translate(${this.chartWidth / 2}, ${this.chartHeight / 2})`);

    let arcEnter = arcs.enter()
      .append('g')
      .attr('class', 'arc');

    arcEnter.append('path')
      .attr('d', this.arc)
      .style('fill', d => this.color(d.data.label));

    /*arcEnter.append('text')
      .attr('transform', d => 'translate(' + this.arc.centroid(d) + ')')
      .attr('dy', '.35em')
      .style('text-anchor', 'middle')
      .text(d => d.data.label);*/

    /************************************************************
     * D3 Transitions
     ***********************************************************/

    //arcs.transition().attr('d', d => this.pie(d.data));

    /************************************************************
     * D3 Exits
     ***********************************************************/
    arcs.exit().transition().remove();
  }

    public update(data: any[]) {
        let propertyKey = this.config.get('propertyKey'),
            propertyX = this.config.get('propertyX'),
            propertyY = this.config.get('propertyY'),
            ticks = this.config.get('bins'),
            x = this.x.xAxis.scale(),
            y = this.y.yAxis.scale(),
            height = this.config.get('height'),
            width = this.config.get('width');

        let histogramData = data.map((d) => d[propertyX]);

        let bins = histogram()
            .domain(x.domain())
            .thresholds(x.ticks(ticks))
            (histogramData);

        this.bins = bins;

        this.y.updateDomainByMinMax(0, max(bins, (d) => d.length));
        this.y.transition();

        this.x.updateDomainByMinMax(
            min(data, (d) => d[propertyX]),
            max(data, (d) => d[propertyX] + (bins[0].x1 - bins[0].x0))
        );

        this.x.transition();

        // JOIN bars
        let bars = this.svg.selectAll('.proteic-bars').selectAll('.' + Globals.SELECTOR_ELEMENT)
            .data(bins);

        // Update bars
        this.elementUpdate = bars;

        // Enter bars
        this.elementEnter = bars
            .enter().append('rect')
            .attr('class', Globals.SELECTOR_ELEMENT)
            .attr('data-proteic-element', 'barHistogram')
            .attr('x', (d) => x(d.x0))
            .attr('y', (d) => y(d.length))
            .attr('width', x(bins[0].x1) - x(bins[0].x0) - 1)
            .attr('height', (d) => height - y(d.length));

        this.elementExit = bars.exit().remove();

        bars
            .on('mousedown.user', this.config.get('onDown'))
            .on('mouseup.user', this.config.get('onUp'))
            .on('mouseleave.user', this.config.get('onLeave'))
            .on('mouseover.user', this.config.get('onHover'))
            .on('click.user', this.config.get('onClick'));
    }

    public getXScale(axis: Axis): d3.scale.Linear<number, number> {
        var min = d3.min(this.series.items[0].data);
        var max = d3.max(this.series.items[0].data);
        var start = this.canvas.plotArea.axisSize.left;
        var end =  this.canvas.plotArea.axisSize.left + this.canvas.plotArea.width;

        axis.setScaleType(ScaleType.Linear);
        return d3.scale.linear()
            .domain([min < 0 ? min : 0, max])
            .nice() // adds additional ticks to add some whitespace
            .range([start, end]);
    }

export function scaleFor(column: ChartColumn<any>, values: number[], minRange: number, maxRange: number, scaleName: string | null | undefined): d3.ScaleContinuousNumeric<number, number> {

  if (scaleName == "ZeroMax")
    return d3.scaleLinear()
      .domain([0, d3.max(values)!])
      .range([minRange, maxRange])
      .nice();

  if (scaleName == "MinMax") {
    if (column.type == "Date" || column.type == "DateTime") {
      const scale = d3.scaleTime()
        .domain(values)
        .range([minRange, maxRange]);

      const f = function (d: string) { return scale(new Date(d)); } as any as d3.ScaleContinuousNumeric<number, number>;
      f.ticks = scale.ticks as any;
      f.tickFormat = scale.tickFormat as any;
      return f;
    }
    else {
      return d3.scaleLinear()
        .domain([d3.min(values)!, d3.max(values)!])
        .range([minRange, maxRange])
        .nice();
    }
  }

  if (scaleName == "Log")
    return d3.scaleLog()
      .domain([d3.min(values)!, d3.max(values)!])
      .range([minRange, maxRange])
      .nice();

  if (scaleName == "Sqrt")
    return d3.scalePow().exponent(.5)
      .domain([d3.min(values)!, d3.max(values)!])
      .range([minRange, maxRange]);

  throw Error("Unexpected scale: " + scaleName);
}

        success:(candles:Candle[])=>{

            const candleList:CandleList = new CandleList(candles);

            let sma8:any[] = candleList.getSMA(8);
            let sma21:any[] = candleList.getSMA(21);
            let sma55:any[] = candleList.getSMA(55);
            
            candles = candles.slice(-180);
            sma8 = sma8.slice(-180);
            sma21 = sma21.slice(-180);
            sma55 = sma55.slice(-180);
            
            $('body').append('<div id="chart"></div>');
            
            const chart = new Chart({
                svg:d3.select('#chart').append('svg'),
                width:1350,
                height:300,
                padding:{top:50,right:70,bottom:0,left:0},
                dateArray:candles.map(candle => candle.date),
                minValue:d3.min(candles.map(candle => candle.low)),
                maxValue:d3.max(candles.map(candle => candle.high))
            });
            
            chart.plotPivots(new CandleList(candles).getPivots().lows,'pivot-lows','blue','low');
            chart.plotPivots(new CandleList(candles).getPivots().highs,'pivot-highs','red','high');
            
            chart.plotDateAxis('date-axis');
            chart.plotValueAxis('price-axis',10);
            // chart.plotSupportLines(candles);
            chart.plotCandles(candles,'price-chart');
            chart.onMouseMove(date=>{
                console.log(date);
            });
            // chart.plotCurve(candles.map(candle => {return {
            //     date:candle.date,
            //     value:candle.low
            // }}),'price-chart','yellow');
            // chart.plotCurve(candles.map(candle => {return {
            //     date:candle.date,
            //     value:candle.high
            // }}),'price-chart','steelblue');
            // chart.plotCurve(sma8,'price-sma-8','red');
            // chart.plotCurve(sma21,'price-sma-21','blue');
            // chart.plotCurve(sma55,'price-sma-55','yellow');
            
            
            
            chart.plotCrossHair();
        },

export function computeDomain(values: number[], ignoreOutliers: boolean) {
  // Don't include infinities and NaNs in the domain computation.
  values = values.filter(z => isFinite(z));

  if (values.length === 0) {
    return [-0.1, 1.1];
  }
  let a: number;
  let b: number;
  if (ignoreOutliers) {
    let sorted = _.sortBy(values);
    a = d3.quantile(sorted, 0.05);
    b = d3.quantile(sorted, 0.95);
  } else {
    a = d3.min(values);
    b = d3.max(values);
  }

  let padding: number;
  let span = b - a;
  if (span === 0) {
    // If b===a, we would create an empty range. We instead select the range
    // [0, 2*a] if a > 0, or [-2*a, 0] if a < 0, plus a little bit of
    // extra padding on the top and bottom of the plot.
    padding = Math.abs(a) * 1.1 + 1.1;
  } else {
    padding = span * 0.2;
  }

  let lower: number;
  if (a >= 0 && a < span) {
    // We include the intercept (y = 0) if doing so less than doubles the span
    // of the y-axis. (We actually select a lower bound that's slightly less
    // than 0 so that 0.00 will clearly be written on the lower edge of the
    // chart. The label on the lowest tick is often filtered out.)
    lower = -0.1 * b;
  } else {
    lower = a - padding;
  }


  let domain = [lower, b + padding];
  domain = d3.scaleLinear().domain(domain).nice().domain();
  return domain;
}