D3
OG
Old school D3 from simpler times
All examples
By author
By category
About
saraquigley
Full window
Github gist
a few of buttons
Built with
blockbuilder.org
This is for Noam
<!DOCTYPE html> <head> <meta charset="utf-8"> <script src="https://d3js.org/d3.v4.min.js"></script> <!-- Bootstrap --> <!-- Latest compiled and minified CSS --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <!-- Optional theme --> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> <!-- end Bootstrap --> <style> body { margin:0;position:fixed;top:0;right:0;bottom:0;left:0; } #story-buttons {margin-left: 360px; margin-top:40px} #commentary {margin-top: 100px;left:120px;font-size:36pt; font-family: "monospace";text-align:center;} </style> </head> <body> <script> function dispatchButton(source) { d3.select("#commentary").text("You selected " + source); } </script> <div id="story-buttons" class="btn-group" role="group" aria-label="questions to be answered"> <button id="thunder" type="button" class="btn btn-default" onClick="dispatchButton('thunder');">Thunder</button> <button id="lightning" type="button" class="btn btn-default" onClick="dispatchButton('lightning');">Lightning</button> <button id="hail" type="button" class="btn btn-default" onClick="dispatchButton('hail');">Hail</button> </div> <div id="commentary" > </div> </body>
https://d3js.org/d3.v4.min.js