apache zeppelin plotly integration

ZeppelinPlotly.scala

import org.json4s._
import org.json4s.JsonDSL._
import org.json4s.jackson.JsonMethods._

object Plotly {
    val scriptUrl: String = "https://cdn.plot.ly/plotly-latest.min.js"
    val stylePolyfill: String = """
    |.plotly .modebar-btn {
    |  display: inline-block;
    |}
    |.plotly .modebar-btn svg {
    |  width: 1em;
    |  height: 1em;
    |}
    """.stripMargin.trim.replaceAll("\n", " ")
    def newPlot(id: String, data: JArray): Unit = newPlot(id, data, null, null)
    def newPlot(id: String, data: JArray, layout: JObject): Unit = newPlot(id, data, layout, null)
    def newPlot(id: String, data: JArray, layout: JObject, config: JObject): Unit = {
        println("%html")
        println(newPlotLiteral(id, data, layout, config))
        println("%text")
    }
    def newPlotLiteral(id: String, data: JArray, layout: JObject, config: JObject): String = {
      val argumentsString = Seq(id, data, layout, config).map(o => Option(o)).flatten.map(arg => arg match {
          case arg: String => JString(arg)
          case arg: JValue => arg
      }).map(o => compact(render(o))).mkString(",")
      val plotlyNewPlot = s"Plotly.newPlot($argumentsString)"
      val output = s"""
      |<script>
      |(function() {
      |  var newPlot = function() { $plotlyNewPlot; }
      |  if (window.Plotly) {
      |    newPlot();
      |  } else {
      |    var head = document.head || document.getElementsByTagName("head")[0];
      |    var st = document.createElement("style");
      |    var css = "$stylePolyfill";
      |    st.type = "text/css";
      |    if (st.styleSheet){
      |      st.styleSheet.cssText = css;
      |    } else {
      |      st.appendChild(document.createTextNode(css));
      |    }
      |    head.appendChild(st);
      |    var sc = document.createElement("script");
      |    sc.type = "text/javascript";
      |    sc.src = "$scriptUrl";
      |    sc.onload = newPlot;
      |    sc.onerror = function(err) { alert(err); }
      |    head.appendChild(sc);
      |  }
      |})();
      |</script>
      """.stripMargin.trim
      output
    }
    def newPlot(data: JArray): Unit = newPlot(data, null, null)
    def newPlot(data: JArray, layout: JObject): Unit = newPlot(data, layout, null)
    def newPlot(data: JArray, layout: JObject, config: JObject): Unit = {
        println("%html")
        println(newPlotLiteral(data, layout, config))
        println("%text")
    }
    def newPlotLiteral(data: JArray, layout: JObject, config: JObject): String = {
      val id = java.util.UUID.randomUUID.toString
      val output = s"""
      |<div id="$id"></div>
      """.stripMargin.trim
      Seq(output, newPlotLiteral(id, data, layout, config)).mkString("\n")
    }
    
}

val x = Seq(1,2,3)
val ys = Seq(Seq(2,3,1), Seq(3,1,2))
val labels = Seq("foo", "bar")
val data = ys.zip(labels).map(yl => (
    ("x" -> x) ~
    ("y" -> yl._1) ~
    ("type" -> "scatter") ~
    ("name" -> yl._2)
))
val layout = (
    ("title" -> "title") ~
    ("xaxis" -> 
        ("title" -> "xaxis")
    ) ~
    ("yaxis" ->
        ("title" -> "yaxis")
    )
)
Plotly.newPlot(data, layout)