Comments (11)
You can add a callback function to be called when the slider moves. Sorry, not gotten to the docs yet.
Here is how to do it, if you want to update a text box value to the slider value for example.
// Callback function (a function that will be called with the slider obj as argument, when the slider
// changes)
var myFn = function(slider) {
var value = slider.value();
$('#myinput').val(value);
}
// Set slider callback function
slider.callback(myFn)
from d3.slider.
+100000000000000000000
from d3.slider.
The slider value can be obtained by slider.value()
Thanks for this issue! This is missing in the documentation, I'll add it there..
from d3.slider.
I'm also editing the title.
If this didn't answer your question, please let me know.
from d3.slider.
How do I get a slide event? Or, better yet, how do I get an event when the user releases the slider after dragging?
from d3.slider.
What I really need is a callback when the drag completes. The scenario would be when the user slides and releases the slider, I need to get the value and save to the server. Listening to mouseup
kind of works but isn't reliable because it depends on where in the dom the user actually releases their mouse or finger.
from d3.slider.
Yes, the callback function is called by the slider when the drag completes, not while its moving, sorry if that wasn't clear.
from d3.slider.
The callback function is called continuously during the drag, not when it's complete. The log below shows one drag without releasing the mouse.
this.slider = d3.slider()
.min(min)
.max(max)
.showRange(true)
.value(this.props.metric.goal)
.tickFormat(tickFormatter)
.tickValues(tv)
.stepValues(_.range(min, max+1))
.callback(function(evt) {
logger.debug('callback: ' + self.slider.value());
});
Console:
[DEBUG][View:MetricScoresItem] callback: 2
[DEBUG][View:MetricScoresItem] callback: 1
[DEBUG][View:MetricScoresItem] callback: 2
[DEBUG][View:MetricScoresItem] callback: 3
[DEBUG][View:MetricScoresItem] callback: 4
[DEBUG][View:MetricScoresItem] callback: 5
[DEBUG][View:MetricScoresItem] callback: 6
[DEBUG][View:MetricScoresItem] callback: 7
[DEBUG][View:MetricScoresItem] callback: 8
[DEBUG][View:MetricScoresItem] callback: 9
[DEBUG][View:MetricScoresItem] callback: 10
[DEBUG][View:MetricScoresItem] callback: 9
[DEBUG][View:MetricScoresItem] callback: 8
[DEBUG][View:MetricScoresItem] callback: 7
[DEBUG][View:MetricScoresItem] callback: 6
[DEBUG][View:MetricScoresItem] callback: 5
[DEBUG][View:MetricScoresItem] callback: 4
from d3.slider.
ahh! I forgot the d3 'drag' event was called during dragging, and not at the end. thanks!
I suppose it would be possible to add a callback to be called for the 'dragend' event. Not sure when I can get to this though. Would you like to try making the change and opening a pull request?
from d3.slider.
There is a problem, when i set a value after slider is init and draw, the slider can't redraw... How to do this?
from d3.slider.
@sujeetsr Did you add callback for the 'dragend' event? I am trying to get value of the slider at any time.
from d3.slider.
Related Issues (6)
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from d3.slider.