Client Script

The %%html and %%script commands enable generating HTML into the notebook, and programming against the DOM using client-side JavaScript.

This example demonstrates generating an <svg> element and then using d3.js to add an SVG element.



In [1]:

    
%%html
<svg id="surface" style="width: 100%; height: 100px"></svg>



In [2]:

    
%%script
require(['d3'], function(d3) {
  d3.select("#surface")
    .append("circle")
    .style("stroke", "black")
    .style("fill", "white")
    .attr("r", 40)
    .attr("cx", 50)
    .attr("cy", 50)
});