score:8
rect.call(zm=d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw));
After a new test i have the answer :
var currentZoom = d3.event.scale;
But only available/readable in the draw() function called by .on("zoom", draw)
rect.call( zm = d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw));
function draw() {
// trace l'axe X
svg.select("g.x.axis").call(xAxis);
// trace l'axe Y
svg.select("g.y.axis").call(yAxis);
// trace la courbe
svg.select("path.line").attr("d", line);
console.log(zm.scale(), zm.translate()); // , zm.translate[1] = Y
console.log(d3.event.scale, d3.event.translate[0]); // , d3.event.translate[1] = Y
}
score:2
As of today (d3.v5), the way to check the zoom level within the closure is by looking at this attribute:
d3.event.transform.k
score:11
As of D3 v4 there are two documented ways of retrieving the zoom state. To quote d3/d3-zoom README (under Zoom Transforms):
To retrieve the zoom state, use event.transform on a current zoom event within a zoom event listener (see zoom.on), or use d3.zoomTransform for a given node.
https://github.com/d3/d3-zoom/blob/master/README.md#zoom-transforms
score:16
In the draw function the current event will have the zoom level (d3.event.scale as you mentioned). Also if you keep the behaviour around like:
var zm = d3.behavior.zoom().x(x).scaleExtent([1,10]).on("zoom", draw);
Then you can find the current zoom level by calling:
zm.scale();
Source: stackoverflow.com
Related Query
- how to know the current Zoom level in D3.js
- How do I specify the initial zoom level in D3?
- How to keep current zoom scale and translate level when re-rendering graph
- How do I resize SVG images on a map as the zoom level changes?
- How to get the zoom level of an svg image using d3
- D3js how to append 2 children at the same level in .enter context
- D3js: How do I clear the zoom scale set by the d3.zoom event?
- D3.js - how to add zoom button with the default wheelmouse zoom behavior
- How do I create a minimap of an SVG using D3 v5 and show the current viewport dimensions?
- How to limit the zoom of a time scale in d3.js to the minute?
- How can I get access to the current selection inside a D3 callback?
- In D3 zoomable sunburst, how do I make the labeling dependent upon the zoom level?
- How to set the zoom factor in D3.js v.4.x?
- How do I change the speed of the zoom in D3
- D3.js v4 - how to add zoom button with the default wheelmouse zoom behavior
- How do you change the interpolation for a zoom behavior in d3.js
- How to set an initially determined zoom level based on data d3js
- how can I see the current element that represents a bar to which the hovering is applied
- How do I know which bar the mouse is in for D3 stacked bar?
- How to initialize the zoom at a given scale?
- d3 circlepacking how to not zoom out when clicking the same node twice
- How to zoom only on the X axis in a line chart in d3.js (v7)
- How to proper zoom and pan only the y-axis in D3 v5 y-axis
- How can I know what dates are displayed in the axis?
- How do I make sure the zoom doesn't go below zero and avoid the zoomed points touching the y and z axis? d3.zoom v4
- How to add the filter or ScaleExtent in d3 v4 in Timeline with Zoom functionality
- D3.js: Text is not showing inside a circle(They are on the same level of an element-group). How do I bring the text to the front?
- HTML / D3.js - how to zoom from the mouse cursor rather than top-left corner
- How to update all existing elements in the same level with same parent value?
- 3djs, force diagram. How to preserve zoom level
More Query from same tag
- SVG marker-mid on specific point on path
- R varied length vector or list in variable
- How to edit the size (or color...) of selection from user search in D3 force layout?
- d3.v4.js Line Graph with brush filter - Error: <path> attribute d: Expected number, "MNaN,NaNLNaN,NaNC…". and Expected number, "M0,NaNL0.1167307672…"
- D3 linkHorizontal() update on mouse position
- How to implement a transition duration using D3.js?
- Nvd3 charts not getting updated using dropdown button
- how to add dragend event on svg element
- Spring Forces in D3.js Force directed layout?
- d3.js brushable choropleth
- Ploting Scales and Axes using d3.js code in Google Datastudio for scatter plot
- consolidating data from a json in a new array and drawing shapes with it using d3.js
- Programmatically opening d3.js v4 collapsible tree nodes?
- Draw a D3 circle with gradient colours
- Plotting an empty interval for elasticsearch date histogram
- Why does d3.json return "null"?
- Draw a path out gradually from the middle
- D3 Javascript library and time functions
- d3 drag function returning error
- Mousemove event won't fire on canvas even if z-index is max
- d3.js number of days between two dates
- NVD3 chart top margin ensuring space for chart title does not work
- Multiple lines with d3.js
- Creating random coordinated svg circles with distance between them
- is D3 looping through the whole array for each callback we set?
- Update a d3.js (v5) selection bound with double nested data
- Right Axis not displaying on Dual Axis Grouped Bar and Line Chart D3
- Dynamic configuration of nested (asynch-forcing) callbacks from json file
- Why 'scaleLinear' never used? and Why I have to included as a <script d3.v4.js>?
- Why does Svg path appears in console but not on screen?