TypeScript Selection.select方法代码示例

	constructor(
		svg: Selection<BaseType, {}, HTMLElement, any>,
		legend: Selection<BaseType, {}, HTMLElement, any>,
		startTime: number, timeStep: number,
		data: Array<[number, number]>,
		buildSegmentTreeTupleNy: (index: number, elements: any) => IMinMax,
		buildSegmentTreeTupleSf: (index: number, elements: any) => IMinMax,
		zoomHandler: () => void,
		mouseMoveHandler: () => void) {

		this.legendTime = legend.select('.chart-legend__time')
		this.legendGreen = legend.select('.chart-legend__green_value')
		this.legendBlue = legend.select('.chart-legend__blue_value')

		// здесь второй базис образован не двумя точками, а
		// эквивалентно точкой и вектором
		// хорошо бы сделать например basisAR1PV()
		// типа смарт-конструктор
		// интересно что есть короткая эквивалентная формулировка
		// this.idxToSpace = new AR1(startTime, timeStep)
		// но она возвращает нас к координатному мышлению
		this.idxToTime = betweenTBasesAR1(bUnit, new AR1Basis(startTime, startTime + timeStep))

		// при добавлении точки первый и второй элемент
		// становятся на место нулевого и первого соответственно
		this.idxShift = betweenTBasesAR1(new AR1Basis(1, 2), bUnit)
		this.buildSegmentTreeTupleNy = buildSegmentTreeTupleNy
		this.buildSegmentTreeTupleSf = buildSegmentTreeTupleSf
		this.zoomHandler = zoomHandler
		this.mouseMoveHandler = mouseMoveHandler
		this.bIndexFull = new AR1Basis(0, data.length - 1)
		this.drawChart(svg, data)
	}

	constructor(
		svg: Selection<BaseType, {}, HTMLElement, any>,
		dataLength: number,
		drawLine: (idx: number, off: number) => string) {
		const node: SVGSVGElement = svg.node() as SVGSVGElement
		const div: HTMLElement = node.parentNode as HTMLElement
		const viewNode: SVGGElement = svg.select('g').node() as SVGGElement
		const t = new ViewWindowTransform(viewNode.transform.baseVal)
		t.setViewPort(div.clientWidth, div.clientHeight)

		const minY = -5
		const maxY = 83
		const minX = animateCosDown(dataLength / 2, 0, 0)
		const maxX = minX + dataLength / 2
		t.setViewWindow(minX, maxX, minY, maxY)

		const paths = svg.select('g.view').selectAll('path')

		let off = 0
		animateBench((elapsed: number) => {
			// Redraw path
			paths.attr('d', (cityIdx: number) => drawLine(cityIdx, off))
			off += 1
		})
	}

 .on("click", () => {
   this.load(
     this.d3node.select(".script-options").property("value"),
     this.d3node.select(".exec-selection").property("value"),
     this.d3node.select(".summarize").property("checked"),
   )
 })

 let click = () => {
   let visible = foldI.classed("fa-plus");
   foldI.classed("fa-plus", !visible);
   foldI.classed("fa-minus", visible);
   parent.select(".foldable")
     .classed("show-toolbar", visible)
     .classed("hide-toolbar", !visible)
   return false;
 };

    json("Environment", sub, EnvironmentInfoWidget.url(this.trial.title), (data: EnvironmentData) => {
      let environment = this.d3node.select(".environment").html("");

      let fold = TrialInfoWidget.createFold(environment, "Environment");
      let filter = EnvironmentInfoWidget.createList(
        environment.append("div").classed("foldable show-toolbar", true),
        data.all, "1"
      );
      TrialInfoWidget.createFilterFold(fold, filter);
    })

    json("File Accesses", sub, DiffInfoWidget.accesses_url(trial1, trial2), (data: DiffAccessData) => {
      let accesses = this.d3node.select(".file-accesses").html("");
      if ((data.fa_added.length > 0) ||
          (data.fa_removed.length > 0) ||
          (data.fa_replaced.length > 0)) {
        let fold = TrialInfoWidget.createFold(accesses, "File Accesses");
        let foldable = accesses.append("div").classed("foldable show-toolbar", true);
        let filter = FileAccessesInfoWidget.createFilter(foldable);
        let ul = foldable.append("ul")
          .classed("fac-list", true)
        this.filter_trial(filter, (strial: number) => {
          ul.html("");

          if ((strial & 1) == 1) {
            for (var element of data.fa_removed) {
              if (!filter.valid(data.t1_path, element)) {
                continue;
              }
              this.fa_li(ul, 'libefore', element);
            }
          }
          if ((strial & 2) == 2) {
            for (var element of data.fa_added) {
              if (!filter.valid(data.t2_path, element)) {
                continue;
              }
              this.fa_li(ul, 'liafter', element);
            }
          }
          if (strial >= 3) {
            for (var elements of data.fa_replaced) {
              let rem = elements[0],
                  add = elements[1];
              if (!filter.valid(data.t1_path, rem) ||
                  !filter.valid(data.t2_path, add)) {
                continue;
              }
              let li = ul.append("li")

              this.fa_cfield(li, 'name', 'Name', rem.name, add.name);
              this.fa_cfield(li, 'mode', 'Mode', rem.mode, add.mode);
              this.fa_cfield(li, 'buffering', 'Buffering', rem.buffering, add.buffering);
              li.append("div")
                .classed("clear", true)
              this.fa_cfield(li, 'timestamp', 'Time', rem.timestamp, add.timestamp);
              this.fa_cfield(li, 'content_hash_before hash', 'Content hash before', rem.content_hash_before, add.content_hash_before);
              this.fa_cfield(li, 'content_hash_after hash', 'Content hash after', rem.content_hash_after, add.content_hash_after);
              this.fa_cfield(li, 'stack', 'Stack', rem.stack, add.stack);
            }
          }
        });
        TrialInfoWidget.createFilterFold(fold, filter);
      }
    });