Recently, I delved into the world of D3.js to explore its capabilities. One particular concept that caught my attention is d3.dispatch(), and I've been experimenting with it for about a week now. Below is a simple example:
<script src="d3.min.js"></script>
<script>
var dispatch = d3.dispatch("load","click");
dispatch.load("Initial Value");
dispatch.on("load", function(textvalue) {
alert(textvalue);
dispatch.on("click", function(newvalue) {
alert(newvalue);
});
});
</script>
I had an assumption that the listener
dispatch.on("load",function(textvalue){}dispatch.load("Initial Value");, triggering a JavaScript alert. However, this wasn't the case. After receiving some helpful insights (thank you Lars!), I made a slight modification to the code as follows:
d3.csv("data.csv", function(error, states) {
dispatch.load("Initial Value");
});
dispatch.on("load", function(textvalue) {
alert(textvalue);
dispatch.on("click", function(state) {
select.text(state);
});
});
</script>
I moved the call dispatch.load within a d3.csv() function, which seemed counterintuitive at first since it still appeared to be calling load() before defining the handler. Surprisingly, this approach worked. Can anyone shed some light on why? P.S. I'm also new to JavaScript, so please pardon any rookie mistakes.
Your assistance is highly appreciated!