With interaction, you can make an existing viz
Description: With interaction, you can make an existing viz have more meaning. Getting Started With the JavaScript API Who isnt this talk for? People who are familiar with the JavaScript API What can I do? Interact with the viz programmatically, on a
Related Topics
Download Presentation
"With interaction, you can make an existing viz" is the property of its rightful owner. Permission is granted to download and print the materials on this website for personal, non-commercial use only, and to display it on your personal computer provided you do not modify the materials and that you retain all copyright notices contained in the materials. By downloading content from our website, you accept the terms of this agreement.
Presentation Transcript
slide1. With interaction,
you can make an existing
viz have more meaning. Getting Started With the JavaScript API<br>
slide2. Who isn’t this talk for? People who are familiar with the JavaScript API<br>
slide3. What can I do? Interact with the viz programmatically, on a webpage that you made.
Build an app.
Tell a story.<br>
slide4. How do I start? 1. Build your webpage<br>
slide5. How do I start? 1. Build your webpage
2. Reference the API JavaScript
<script src=http://your-server-here/javascripts/api/tableau_v8.js><br>
slide6. How do I start? 1. Build your webpage
2. Reference the API JavaScript
<script src=http://your-server-here/javascripts/api/tableau_v8.js>
3. Embed a viz using the JavaScript API.<br>
slide7. Demo Time!<br>
slide8. Now what?<br>
slide9. Interaction! Switching tabs
Selecting
Filtering<br>
slide10. More demo time!<br>
slide11. JavaScript API Tutorial Walkthrough on our website<br>
slide12. Geeking out with JavaScript First, how many of you have written JavaScript before?<br>
slide13. Debugging http://your-server-here/javascripts/api/tableau_v8.debug.js><br>
slide14. Synchronous vs. Async If it’s asynchronous, it ends in Async
Async calls say “go do this and report back”
Sync calls say “do this while I wait”<br>
slide15. The fun stuff is Asynchronous If you want asynchronous things to happen in an order, you need to chain them together. It looks a little like this:
sheet.applyFilterAsync(a, b ,c)
.then(function () {
return sheet.selectMarksAsync(x, y);
})
.then(function() {
return sheet.applyRangeFilterAsync(r, v);
})
.otherwise(throwError)
.always(doSomethingElse);<br>
slide16. The fun stuff is Asynchronous Or, you can use event handlers, like this:
handler = function(marksEvent) {
// do some stuff here when marks are selected
}
viz.addEventListener(
tableauSoftware.TableauEventName.marksselection,
handler);
// or maybe you can let the user select marks
sheet.selectMarksAsync(x, y, tableauSoftware.SelectionUpdateType.REPLACE);<br>
slide17. Async Demo Time<br>
slide18. Want to know more? Go to these sessions! Using the JavaScript API at the National Heritage Academies (Today, 4 – 5)
You did WHAT with the JavaScript API? (Tomorrow, 3:15 – 4:15)
Infinite Interactivity with the JavaScript API (Wednesday, 9:45 – noon)<br>
you can make an existing
viz have more meaning. Getting Started With the JavaScript API<br>
slide2. Who isn’t this talk for? People who are familiar with the JavaScript API<br>
slide3. What can I do? Interact with the viz programmatically, on a webpage that you made.
Build an app.
Tell a story.<br>
slide4. How do I start? 1. Build your webpage<br>
slide5. How do I start? 1. Build your webpage
2. Reference the API JavaScript
<script src=http://your-server-here/javascripts/api/tableau_v8.js><br>
slide6. How do I start? 1. Build your webpage
2. Reference the API JavaScript
<script src=http://your-server-here/javascripts/api/tableau_v8.js>
3. Embed a viz using the JavaScript API.<br>
slide7. Demo Time!<br>
slide8. Now what?<br>
slide9. Interaction! Switching tabs
Selecting
Filtering<br>
slide10. More demo time!<br>
slide11. JavaScript API Tutorial Walkthrough on our website<br>
slide12. Geeking out with JavaScript First, how many of you have written JavaScript before?<br>
slide13. Debugging http://your-server-here/javascripts/api/tableau_v8.debug.js><br>
slide14. Synchronous vs. Async If it’s asynchronous, it ends in Async
Async calls say “go do this and report back”
Sync calls say “do this while I wait”<br>
slide15. The fun stuff is Asynchronous If you want asynchronous things to happen in an order, you need to chain them together. It looks a little like this:
sheet.applyFilterAsync(a, b ,c)
.then(function () {
return sheet.selectMarksAsync(x, y);
})
.then(function() {
return sheet.applyRangeFilterAsync(r, v);
})
.otherwise(throwError)
.always(doSomethingElse);<br>
slide16. The fun stuff is Asynchronous Or, you can use event handlers, like this:
handler = function(marksEvent) {
// do some stuff here when marks are selected
}
viz.addEventListener(
tableauSoftware.TableauEventName.marksselection,
handler);
// or maybe you can let the user select marks
sheet.selectMarksAsync(x, y, tableauSoftware.SelectionUpdateType.REPLACE);<br>
slide17. Async Demo Time<br>
slide18. Want to know more? Go to these sessions! Using the JavaScript API at the National Heritage Academies (Today, 4 – 5)
You did WHAT with the JavaScript API? (Tomorrow, 3:15 – 4:15)
Infinite Interactivity with the JavaScript API (Wednesday, 9:45 – noon)<br>