How to use the d3.selectAll function in d3

To help you get started, we’ve selected a few d3 examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github govau / performance-dashboard / client / src / _dashboard-legacy / d3-charts-dto / spec / javascripts / Charts / LineChartSpec.js View on Github external
it('tooltip rulers should have correct position', () => {
      d3.selectAll('.ruler').each(function(d, i) {
        expect(d3.select(this).attr('y1')).toEqual('0');
        expect(d3.select(this).attr('y2')).toEqual('300');
      });
    });
github OpenSOC / opensoc-ui / src / kibana / components / vislib / modules / areaChart.js View on Github external
chart.getSelection = function (elem, data) {
      try {
        if (!elem) {
          throw new Error('No valid elem');
        }
        if (!data) {
          throw new Error('No valid data');
        }

        var selection = d3.selectAll(getSelection(elem, data));

        return selection;
      } catch (error) {
        console.error('chart.getSelection: ' + error);
      }
    };
github broadinstitute / gtex-viz / src / scripts / main.junction.js View on Github external
function reset(){
    d4.select("#chart").selectAll("*").remove();
    d4.select("#model").selectAll("*").remove();
    d4.select("#boxplot").selectAll("*").remove();
    d4.select("#dashboardToolbar").style("display", "none");
    d4.selectAll("*").classed("inView", false);
}
github metasfresh / metasfresh-webui-frontend / src / components / charts / StackedGroupedBars.js View on Github external
.attr("width", x.bandwidth())
            .attr("height", 0);

        rect.transition()
            .delay(function(d, i) { return i * 10; })
            .attr("y", function(d) { return y(d[1]); })
            .attr("height", function(d) { return y(d[0]) - y(d[1]); });

        g.append("g")
            .attr("class", "axis axis--x")
            .attr("transform", "translate(0," + height + ")")
            .call(d3.axisBottom(x)
                .tickSize(0)
                .tickPadding(6));

        d3.selectAll("input")
            .on("change", changed);

        var timeout = d3.timeout(function() {
        d3.select("input[value=\"grouped\"]")
            .property("checked", true)
            .dispatch("change");
        }, 2000);

        function changed() {
        timeout.stop();
        if (this.value === "grouped") transitionGrouped();
        else transitionStacked();
        }

        function transitionGrouped() {
        y.domain([0, yMax]);
github Graylog2 / graylog2-server / graylog2-web-interface / src / components / sources / SourceDataTable.jsx View on Github external
table.selectAll('td.dc-table-column a.dc-filter-link').on('click', () => {
      const parentTdElement = $(d3.event.target).parents('td.dc-table-column._0');
      const datum = d3.selectAll(parentTdElement).datum();

      onDataFiltered(datum.name);
    });
  };
github AllonKleinLab / SPRING_dev / src / PAGA_viewer.js View on Github external
PAGA_redraw() {
    let node_scale = (d3.select('#PAGA_node_size_slider').node().value / 40) ** 1.8;
    let edge_scale = (d3.select('#PAGA_edge_width_slider').node().value / 40) ** 3;

    d3.selectAll('.PAGA_node')
      .attr('cx', d => {
        return d.coordinates[0];
      })
      .attr('cy', d => {
        return d.coordinates[1];
      })
      .attr('r', d => {
        return Math.sqrt(d.size) * 2 * node_scale;
      })
      .attr('fill', d => {
        return d.color;
      })
      .attr('stroke-width', d => {
        if (d.selected) {
          return (15 + (Math.sqrt(d.size) / 5) * node_scale).toString() + 'px';
        } else {
github apache / skywalking-ui / src / components / TraceTree / d3-trace.js View on Github external
topSlow() {
    d3.selectAll('.time-inner').style('opacity', 0);
    d3.selectAll('.time-inner-duration').style('opacity', 1);
    d3.selectAll('.trace-tree-node-selfchild').style('opacity', 0);
    d3.selectAll('.trace-tree-node-selfdur').style('opacity', 1);
    this.nodeUpdate._groups[0].forEach(i => {
      d3.select(i).style('opacity', .2);
      if(i.__data__.data.dur >= this.smin && i.__data__.data.dur <= this.smax){
        d3.select(i).style('opacity', 1);
      }
    })
  }
  getZoomBehavior(g) {
github AllonKleinLab / SPRING_dev / src / diffex_script.js View on Github external
scatter_x.domain([
      0,
      d3.max(scatter_data, d => {
        return d[0] * scatter_zoom;
      }) + 0.02,
    ]);
    scatter_y.domain([
      0,
      d3.max(scatter_data, d => {
        return d[0] * scatter_zoom;
      }) + 0.02,
    ]);
    d3.select('#diffex_scatter_x_axis').call(scatter_xAxis);
    d3.select('#diffex_scatter_y_axis').call(scatter_yAxis);

    d3.selectAll('.diffex-scatter-dots')
      .data(scatter_data)
      .enter()
      .append('svg:circle');
    d3.selectAll('.diffex-scatter-dots')
      .attr('cx', (d, i) => {
        return scatter_x(d[0] + d[2] * scatter_jitter);
      })
      .attr('cy', d => {
        return scatter_y(d[1] + d[3] * scatter_jitter);
      })
      .attr('r', scatter_size);
  }