score:1
Accepted answer
I never used d3.lasso
before but looking at this bl.ock using d3 v4, looks like your code is missing a few minor things:
Area to be passed to
d3 lasso
is now done usingtargetArea
var lasso = d3.lasso() .targetArea(svg)
Items passed to
d3 lasso
must be ad3 selection
and not a stringvar circles = svg.selectAll("circle")... var lasso = d3.lasso() .items(circles)
And of course, using the actual minified lasso code in a script tag, here's a snippet:
Also, I've added some CSS to the selected
circles just to differentiate when compared with others:
.selected {
fill: steelblue;
}
Hope this helps.
Source: stackoverflow.com
Related Query
- How to implement D3 lasso plugin with Angular 2 and Typescript
- Lasso and D3.js
- D3.js: How to get the computed width and height for an arbitrary element?
- What is the difference between svg's x and dx attribute?
- Fast and responsive interactive charts/graphs: SVG, Canvas, other?
- What is the difference between D3 and jQuery?
- Difference between GeoJSON and TopoJSON
- How do I remove all children elements from a node and then apply them again with different color and size?
- How do I save/export an SVG file after creating an SVG with D3.js (IE, safari and chrome)?
- D3 javascript Difference between foreach and each
- Highlight selected node, its links, and its children in a D3 force directed graph
- D3, nested appends, and data flow
- Use D3 and Shiny to implement `identify()` in R
- 3 dimension (X, Y and Z) graph using D3.js
- D3 difference between ordinal and linear scales
- D3 transform scale and translate
- State of SVG Performance on iOS and other Tablets?
- d3.js Map (<svg>) Auto Fit into Parent Container and Resize with Window
- Difference between svg and canvas in d3.js
- Add text label to d3 node in Force directed Graph and resize on hover
- D3 Differentiate between click and drag for an element which has a drag behavior
- How/Where do I get geoJSON data for states, provinces, and administrative regions of non-US countries?
- d3 update data and update graph
- D3js: When to use .datum() and .data()?
- Simple graph of nodes and links without using force layout
- How to properly add and use D3 Events?
- How to use d3.min and d3.max within a d3.json command
- d3.js and document.onReady
- What is the difference between D3.js and Cytoscape.js?
- D3.js binding an object to data and appending for each key
More Query from same tag
- Use D3.js to find Centroid of SVG Path
- Bootstrap modal doesn't pop up when a node is clicked
- Display area on D3 graph
- can you add filterHandler for composite chart, dc.js?
- Adding space Before and after the Svg:rect - d3.js
- d3.js Map not Showing
- How to update percent values of custom tooltip in angular nvd3 pie chart
- Transitioning d3.radar chart
- How to draw a 3d bar chart on a world map with d3.js?
- How to stop d3.histogram() trimming leading and trailing empty bins
- d3: tree layout from flare.json - how to include only some of nodes?
- Adding tool tip to collapse graph
- Fixing vertical alignment of sink nodes in d3 js Sankey
- using d3.js with aurelia framework
- d3js v6 reading multiple csv with Promise.all returning 404
- drag multiple nodes in d3 force directed layout
- Unable to show the X-axis value only once inside the "rect " using d3
- D3.js code not rendering in browser when loaded from file, but works fine in console
- paths should be a straight line
- Move a line through a given direction in D3 js?
- How to create a drop down in a HTML table and d3 bar chart
- Creating clusters in a sortable bar chart in D3
- d3 real time graph syncing issues
- Change color of selected map feature in d3.js
- Using selectors to retrieve fill and stroke colors?
- how to convert translate()[0] to d3 v4
- Getting TypeError while useing MetricsGraphics.js
- How long will D3.js v3 be supported?
- Access Element using D3
- D3 not show Circles