score:14
Accepted answer
The zoom scale is stored in your zoom object. I'm guessing you have a line of code that looks like:
var zoom = d3.behavior.zoom()
Getting the scale from that object is simple:
zoom.scale()
To zoom out x2:
zoom.scale( zoom.scale()/2 )
Translation works the same way, with zoom.translate() and zoom.translate( [x, y] ) to get and set.
To keep the display transform in sync with the zoom, just make sure that when you update one, the other is also updated.
score:0
There's a easier way in D3 v5. You can call selection.call(zoom.transform, d3.zoomIdentity); to reset the zoom, and even apply a smooth transition like selection.transition().duration(750).call(zoom.transform, d3.zoomIdentity);.
Source:
Source: stackoverflow.com
Related Query
- D3js: How do I clear the zoom scale set by the d3.zoom event?
- how to set the domain and scale on an axis on a nvd3.js multiBarChart
- D3: How do I set "click" event and "dbclick" event at the same time?
- How to set the domain and scale on an yaxis on a discreteBarChart nvd3.js
- How to limit the zoom of a time scale in d3.js to the minute?
- How to set the zoom factor in D3.js v.4.x?
- How to set an initially determined zoom level based on data d3js
- D3, Scale How to set the scale?
- How to set the browser window size according to D3JS graph?
- How to set up the scale with d3js?
- d3js - Stacked Bar Chart in Horizontal Axis - How do I set x so the bars are seperated?
- How to set a scale for the time series, current x scale gives me NaN?
- how do I set up a grouping query on the server side. I want set up the query so I can use it for a pie chart in front end, using d3js
- How to link multiple graph networks in d3js so that an event in one calls the same event in other networks
- How to set zoom step in D3JS v4?
- how to set up the scale of yAxis in D3.js with a csv file with multiple columns
- How to set the background-color of a D3.js svg?
- d3.js - How can I set the cursor to hand when mouseover these elements on SVG container?
- How to customize the color scale in a D3 line chart?
- D3js how to append 2 children at the same level in .enter context
- How to set the origin while drag in d3.js in v4
- how to know the current Zoom level in D3.js
- How do we change the tick values generated by a linear scale in a d3.js line plot?
- D3 force layout: How do I set the size of every node?
- How do I specify the initial zoom level in D3?
- How to set the Origin (drag.origin) for drag behavior in d3 JavaScript library
- d3js - how to set albers projection properly?
- why isn't the checkbox change event triggered when i do it programatically in d3js
- D3 manually zoom,how to set the translate for zoom
- How can I dispatch a 'zoom' event after setting scale (d3, zoom.behavior)
More Query from same tag
- Stacked bar chart reversed
- How do I perform append after DOM elements updatein a D3 chart?
- Scale a path object after translating
- d3 mapping numbers with scale
- in browser screenshots of nvd3 (or d3 with css)
- D3 charting tool: Cannot display labels above columns in bar chart
- How do I calculate partial totals in crossfilter?
- D3 V4 Properly placing a bubble in the US Map
- D3 Collapsible tree not working properly in angular
- Custom breadcrumb UI for d3.js treemap
- javascript d3.js: initialize brush with brush.extent and stop data from spilling over margin
- Get the type of element in a selection
- Plotting points using d3.geo.tile
- what's wrong with my label update selection
- D3 - force layout, circle within circle
- How can I reverse the direction of arrow shown in this jsfiddle http://jsfiddle.net/5qaL886d/1/
- why the shape can't be dragged in d3.js
- D3.js Donut Chart change node colors and add text label to middle
- d3 version 4 path line smooth transition with Mike Bostock's example
- How to display nested nodes from nested data in d3js?
- Is it possible to eliminate lag in rendering the mouse location for d3?
- d3.v3 Horizontal Tree Structure with Collapsible Boxes
- How to access text elements in GeoJson data?
- Reorder elements on mouse over (to solve Z-index conflict) when data is bound through `selectAll.data(data)`
- d3.js mouseover mouseout issue
- turn Y axis upside down
- D3.js patterns for managing multiple elements bound to same data
- d3 data selection for creating a simple chart
- Build XML with CSV data
- How to create speedometer in D3JS?
