All examples By author By category About

micahstubbs

Blocks Graph III Voronoi Mouseover

this bl.ock is a step closer to using a Voronoi overlay for easier mouseover interactions with nodes. when you mouseover a Voronoi polygon, the polygon will appear, the circle representing the node that it contains will briefly grow.

      svg.selectAll("path.voronoi")
        .on('mouseover', function(d) {
          // highlight the node
          d3.selectAll("circle").filter(function (p) {
            return p.id === d.data.id
          })
            .transition()
            .duration(1200)
            .attr("r", 8)
            .transition()
            .duration(1200)
            .attr("r", 3)

          // show the Voronoi polygon
          d3.select(this)
            .transition()
            .delay(1200)
            .duration(1500)
            .style("fill-opacity", 0.4)
            .style("stroke-opacity", 1)
        });

readme-vis is a look at README.md files from bl.ocks.org that contain links to other bl.ocks

community detection done with the jLouvain library

source data and scripts used to generate the graph data are at this repository

a set of bl.ocks informed this iteration:

MIT License