2b:null 2c:["$","title",null,{"children":"Who do MPs follow? - search the map #1 | vix18 | Observable"}] 31:T60a,chart = { const zoom = d3.zoom() .scaleExtent([1, 50]) .on("zoom", zoomed); const svg = d3.create("svg") .attr("width", 650) .attr("viewBox", [-margin.left, -margin.top, width+margin.right, height+margin.bottom]); const gGrid = svg.append("g"); const gDot = svg.append("g") .attr("fill", "none") .attr("stroke-linecap", "round"); gDot.selectAll("path") .data(search) .join("path") .attr("d", d => `M${x(percentageX(d["Con followers"]))},${y(percentageY(d["Lab followers"]))}h0`) .attr("stroke", d => z([d["Lab followers"], d["Con followers"]])) .attr("stroke-width", d=> Math.sqrt(area(d["MP followers"]))) .attr("stroke-opacity", function(d) { if (notSelected.length == 0) { return 0.1+((d["Lab followers"]/195)**2 + (d["Con followers"]/318)**2) } else { return 0.8 } }) const gx = svg.append("g"); const gy = svg.append("g"); svg.call(zoom).call(zoom.transform, d3.zoomIdentity); function zoomed({transform}) { const zx = transform.rescaleX(x).interpolate(d3.interpolateRound); const zy = transform.rescaleY(y).interpolate(d3.interpolateRound); gDot.attr("transform", transform).attr("stroke-width", Math.sqrt(area(transform.k))); gx.call(xAxis, zx); gy.call(yAxis, zy); gGrid.call(grid, zx, zy); } return Object.assign(svg.node(), { reset() { svg.transition() .duration(750) .call(zoom.transform, d3.zoomIdentity); } }); }32:T517,tooltip = { chart const tooltip = d3.select('body').append('div') .attr('class', 'tooltip') .style('position', 'absolute') .style('visibility', 'hidden') d3.selectAll("path") .on("mouseover", function(e, d){ d3.select(this).transition() .attr("stroke-width", d=> 2 * Math.sqrt(area(484))) //.attr("stroke-opacity", 1) }) .on("mousemove", function(e, d){ return tooltip .html(`\ Name: ${d.Name}
\ MP followers: ${d["MP followers"]}
\ Con followers: ${d["Con followers"]}
\ Lab followers: ${d["Lab followers"]}
\ Click to open ${d.Name}
`) .style("top", (e.pageY-10)+"px") .style("left",(e.pageX+20)+"px") .style("visibility", "visible"); }) .on("mouseout", function(e, d){ d3.select(this).transition() .attr("stroke-width", d=> Math.sqrt(area(d["MP followers"]))) //.attr("stroke-opacity", 0.8) // d=> (0.1+(d["Lab followers"]/195)**2 + (d["Con followers"]/318)**2)) return tooltip.html(``).style("visibility", "hidden"); }) .on("click", function(e, d) { d3.select(this).transition() window.open("https://twitter.com/"+d.Name); }) }33:[{"id":"8e4371790541c9f3d3d35430fef52a1526f735680f2580ebaae080f326468d0539ae27b813c3682a9b6117ddd89d27305bcb2237258aa60050c186f5278502d5","href":"https://static.observableusercontent.com/files/8e4371790541c9f3d3d35430fef52a1526f735680f2580ebaae080f326468d0539ae27b813c3682a9b6117ddd89d27305bcb2237258aa60050c186f5278502d5","name":"Influencers.csv","type":"text/csv","lastModified":1622750626934.506,"size":11154034}] 2f:{"id":"dbbe6a8d2ef9a24b","slug":"who-do-mps-follow-search-the-map-1","title":"Who do MPs follow? - search the map #1","thumbnail":"ba2815889f5a11b022685bb273170b04ea519c869186cf42abe0fc9c4308e80f","access_level":"public","create_time":"$D2021-06-03T20:03:46.934Z","update_time":"$D2021-06-03T20:03:46.934Z","view_time":null,"first_public_time":"$D2021-12-02T13:58:25.152Z","fork":true,"stars":0,"starred":false,"owner":{"type":"team","id":"5d53dd32a08085f0","login":"vix18","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fc8d29517df5336425f605bf4d0212743dc2327fcaf64bbd15a556c8a40ba17c","tier":"starter_2024"},"version":801,"publish_version":801,"role":null,"authored":false,"authors":[{"type":"individual","id":"9b8b1900123f0221","login":"vix18","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fc8d29517df5336425f605bf4d0212743dc2327fcaf64bbd15a556c8a40ba17c","tier":null}],"members":[{"type":"individual","id":"9b8b1900123f0221","login":"vix18","name":"","avatar_url":"https://avatars-next.observableusercontent.com/fc8d29517df5336425f605bf4d0212743dc2327fcaf64bbd15a556c8a40ba17c","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"title":"Who do MPs follow? - search the map #1","cells":[{"id":0,"value":"md`# Who do MPs follow? - search the map #1\n\nThis zoomable chart shows every twitter account followed by more than 10 MPs\n\nSearch in the box below to highlight influencers\n\n`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined"},{"id":190,"value":"viewof reset = html`