Skip to content

Instantly share code, notes, and snippets.

@jamesleesaunders

jamesleesaunders/README.md

Last active August 29, 2015 14:23
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save jamesleesaunders/b5797814ae61863928e1 to your computer and use it in GitHub Desktop.
Save jamesleesaunders/b5797814ae61863928e1 to your computer and use it in GitHub Desktop.
Download ZIP
D3 : Dispatch
Raw
index.html
<!DOCTYPE html>
<head>
<title>D3 Lesson 32 : Dispatch</title>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js" charset="utf-8"></script>
</head>
<body>
<h1>D3 Dispatch Example</h1>
<div id="holder1"></div>
<div id="holder2"></div>
<script>
// Documentation: https://github.com/mbostock/d3/wiki/Internals#events
// This is an implementation of the publish/subscribe pattern
// e.g. http://addyosmani.com/resources/essentialjsdesignpatterns/book/#observerpatternjavascript
// Create a dispatcher object
var myDispatch = d3.dispatch('countrySelect');
// Set up event handlers for when countrySelect event is fired
myDispatch.on('countrySelect.sub1', function(country) {
console.log(country, 'selected (1)');
d3.select('#holder1').html('1: ' + country + ' Selected');
});
myDispatch.on('countrySelect.sub2', function(country) {
console.log(country, 'selected (2)');
d3.select('#holder2').html('2: ' + country + ' Selected');
});
// Trigger the event
myDispatch.countrySelect('France');
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment