dc.js boxplot example in ifsharp notebook

dc_boxplot.ipynb

{
 "metadata": {
  "language": "fsharp",
  "name": "",
  "signature": "sha256:edecb751c7f8238f10b2f91efddcbad5e12e537b318c2cc45a9160c6f4be48ef"
 },
 "nbformat": 3,
 "nbformat_minor": 0,
 "worksheets": [
  {
   "cells": [
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "#r \"Newtonsoft.Json.dll\"\n",
      "open Newtonsoft.Json\n",
      "\n",
      "type DataPoint = { group: obj; value: double }\n",
      "\n",
      "let grp1 = [| 31.85561; 27.11547; 37.25393; 29.25786; 22.66603; 24.78852; 32.89424; \n",
      "              30.64445; 32.83173; 28.87223; 31.66821; 32.06483; 31.99000; 34.25497;\n",
      "              22.15957; 25.48147; 33.89239; 38.68366; 27.90304; 30.09659 |] \n",
      "           |> Array.map (fun p -> {group=1; value=p})\n",
      "              \n",
      "let grp2 = [| 15.517010; 36.764752; 9.812037; -13.490238; 15.793732; 16.739250; -33.520497; \n",
      "              47.088927; -6.835000; 29.999934; -38.679756;  10.523867; -26.709548; 15.276023; -32.944685|]\n",
      "           |> Array.map (fun p -> {group=2; value=p})\n",
      "\n",
      "let data = Array.append grp1 grp2"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 26
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "let template = \"\"\"\n",
      "<link rel=\"stylesheet\" type=\"text/css\" href=\"//cdnjs.cloudflare.com/ajax/libs/dc/2.0.0-beta.3/dc.css\">\n",
      "<div class=\"dc-chart\" id=\"box-test\"><svg></svg></div>\n",
      "<script type=\"text/javascript\">\n",
      "require.config({\n",
      "  paths: {d3: \"//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3\",\n",
      "          crossfilter: \"//cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.11/crossfilter\",\n",
      "          dc: \"//cdnjs.cloudflare.com/ajax/libs/dc/2.0.0-beta.3/dc\"},\n",
      "  shim: {'crossfilter': {deps: [], exports: 'crossfilter'}}\n",
      "  });\n",
      "require([\"d3\", \"crossfilter\", \"dc\"], function(d3, crossfilter, dc) {\n",
      "var data = {DATUM};\n",
      "var ndx = crossfilter(data),\n",
      "  groupDimension = ndx.dimension(function(d) {return d.group;}),\n",
      "  valueArrayGroup = groupDimension.group().reduce(\n",
      "    function(p,v) { p.push(v.value); return p; },\n",
      "    function(p,v) { p.splice(p.indexOf(v.value), 1); return p; },\n",
      "    function() { return []; }\n",
      "  );\n",
      "\n",
      "dc.boxPlot(\"#box-test\")\n",
      "  .width(600)\n",
      "  .height(400)\n",
      "  .dimension(groupDimension)\n",
      "  .group(valueArrayGroup);\n",
      "\n",
      "dc.renderAll();\n",
      "});\n",
      "</script>\n",
      "\"\"\""
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 27
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "let html =\n",
      "    template.Replace(\"{DATUM}\", JsonConvert.SerializeObject(data))"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [],
     "prompt_number": 28
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [
      "html |> Util.Html"
     ],
     "language": "python",
     "metadata": {},
     "outputs": [
      {
       "html": [
        "\n",
        "<link rel=\"stylesheet\" type=\"text/css\" href=\"//cdnjs.cloudflare.com/ajax/libs/dc/2.0.0-beta.3/dc.css\">\n",
        "<div class=\"dc-chart\" id=\"box-test\"><svg></svg></div>\n",
        "<script type=\"text/javascript\">\n",
        "require.config({\n",
        "  paths: {d3: \"//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3\",\n",
        "          crossfilter: \"//cdnjs.cloudflare.com/ajax/libs/crossfilter/1.3.11/crossfilter\",\n",
        "          dc: \"//cdnjs.cloudflare.com/ajax/libs/dc/2.0.0-beta.3/dc\"},\n",
        "  shim: {'crossfilter': {deps: [], exports: 'crossfilter'}}\n",
        "  });\n",
        "require([\"d3\", \"crossfilter\", \"dc\"], function(d3, crossfilter, dc) {\n",
        "var data = [{\"group\":1,\"value\":31.85561},{\"group\":1,\"value\":27.11547},{\"group\":1,\"value\":37.25393},{\"group\":1,\"value\":29.25786},{\"group\":1,\"value\":22.66603},{\"group\":1,\"value\":24.78852},{\"group\":1,\"value\":32.89424},{\"group\":1,\"value\":30.64445},{\"group\":1,\"value\":32.83173},{\"group\":1,\"value\":28.87223},{\"group\":1,\"value\":31.66821},{\"group\":1,\"value\":32.06483},{\"group\":1,\"value\":31.99},{\"group\":1,\"value\":34.25497},{\"group\":1,\"value\":22.15957},{\"group\":1,\"value\":25.48147},{\"group\":1,\"value\":33.89239},{\"group\":1,\"value\":38.68366},{\"group\":1,\"value\":27.90304},{\"group\":1,\"value\":30.09659},{\"group\":2,\"value\":15.51701},{\"group\":2,\"value\":36.764752},{\"group\":2,\"value\":9.812037},{\"group\":2,\"value\":-13.490238},{\"group\":2,\"value\":15.793732},{\"group\":2,\"value\":16.73925},{\"group\":2,\"value\":-33.520497},{\"group\":2,\"value\":47.088927},{\"group\":2,\"value\":-6.835},{\"group\":2,\"value\":29.999934},{\"group\":2,\"value\":-38.679756},{\"group\":2,\"value\":10.523867},{\"group\":2,\"value\":-26.709548},{\"group\":2,\"value\":15.276023},{\"group\":2,\"value\":-32.944685}];\n",
        "var ndx = crossfilter(data),\n",
        "  groupDimension = ndx.dimension(function(d) {return d.group;}),\n",
        "  valueArrayGroup = groupDimension.group().reduce(\n",
        "    function(p,v) { p.push(v.value); return p; },\n",
        "    function(p,v) { p.splice(p.indexOf(v.value), 1); return p; },\n",
        "    function() { return []; }\n",
        "  );\n",
        "\n",
        "dc.boxPlot(\"#box-test\")\n",
        "  .width(600)\n",
        "  .height(400)\n",
        "  .dimension(groupDimension)\n",
        "  .group(valueArrayGroup);\n",
        "\n",
        "dc.renderAll();\n",
        "});\n",
        "</script>\n"
       ],
       "metadata": {},
       "output_type": "pyout",
       "prompt_number": 29
      }
     ],
     "prompt_number": 29
    },
    {
     "cell_type": "code",
     "collapsed": false,
     "input": [],
     "language": "python",
     "metadata": {},
     "outputs": []
    }
   ],
   "metadata": {}
  }
 ]
}