example-freeboard.json

{
  "version": 1,
  "allow_edit": true,
  "plugins": [],
  "panes": [
    {
      "title": "Line 1",
      "width": 1,
      "row": {
        "3": 1,
        "4": 1,
        "5": 1,
        "6": 1
      },
      "col": {
        "3": 1,
        "4": 1,
        "5": 1,
        "6": 2
      },
      "col_width": 1,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart1",
            "data": "[[1,2,3]]",
            "chartHeight": 300,
            "chartWidth": 300,
            "height": 5
          }
        }
      ]
    },
    {
      "title": "Line 2",
      "width": 1,
      "row": {
        "3": 1,
        "4": 1,
        "5": 1,
        "6": 1
      },
      "col": {
        "3": 2,
        "4": 2,
        "5": 2,
        "6": 3
      },
      "col_width": 1,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart2",
            "data": "[[3,7,9,1,4,6,8,2,5]]",
            "options": "{\n  series: [ {color:'orange'} ]\n}",
            "chartHeight": 300,
            "chartWidth": 300,
            "height": 5
          }
        }
      ]
    },
    {
      "title": "bar (horizontal)",
      "width": 1,
      "row": {
        "3": 1,
        "4": 1,
        "5": 1,
        "6": 1
      },
      "col": {
        "3": 3,
        "4": 3,
        "5": 3,
        "6": 4
      },
      "col_width": 1,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart3",
            "data": "[[3,7,9,1,4,6,8,2,5]]",
            "options": "{\n        seriesDefaults: {\n            renderer:$.jqplot.BarRenderer,\n            // Show point labels to the right ('e'ast) of each bar.\n            // edgeTolerance of -15 allows labels flow outside the grid\n            // up to 15 pixels.  If they flow out more than that, they \n            // will be hidden.\n            pointLabels: { show: true, location: 'e', edgeTolerance: -15 },\n            // Rotate the bar shadow as if bar is lit from top right.\n            shadowAngle: 135,\n            // Here's where we tell the chart it is oriented horizontally.\n            rendererOptions: {\n                barDirection: 'horizontal'\n            }\n        },\n        axes: {\n            yaxis: {\n                renderer: $.jqplot.CategoryAxisRenderer\n            }\n        }\n    }",
            "chartHeight": 300,
            "chartWidth": 300,
            "height": 5
          }
        }
      ]
    },
    {
      "title": "bar (vertical)",
      "width": 1,
      "row": {
        "3": 1,
        "4": 1,
        "5": 1,
        "6": 1
      },
      "col": {
        "3": 3,
        "4": 4,
        "5": 4,
        "6": 5
      },
      "col_width": 1,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart4",
            "data": "[[1,2,3]]",
            "options": "{\n    series: [ {color:'red'} ],\n        seriesDefaults: {\n            renderer:$.jqplot.BarRenderer,\n            // Show point labels to the right ('e'ast) of each bar.\n            // edgeTolerance of -15 allows labels flow outside the grid\n            // up to 15 pixels.  If they flow out more than that, they \n            // will be hidden.\n            pointLabels: { show: true, location: 'e', edgeTolerance: -15 },\n            // Rotate the bar shadow as if bar is lit from top right.\n            shadowAngle: 135,\n            // Here's where we tell the chart it is oriented horizontally.\n            rendererOptions: {\n                barDirection: 'vertical'\n            }\n        },\n        axes: {\n            yaxis: {\n                renderer: $.jqplot.CategoryAxisRenderer\n            }\n        }\n    }",
            "chartHeight": 300,
            "chartWidth": 300,
            "height": 5
          }
        }
      ]
    },
    {
      "title": "Pie",
      "width": 1,
      "row": {
        "3": 1,
        "5": 13,
        "6": 1
      },
      "col": {
        "3": 3,
        "5": 1,
        "6": 6
      },
      "col_width": 2,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart5",
            "data": "[[\n    ['Heavy Industry', 12],['Retail', 9], ['Light Industry', 14], \n    ['Out of home', 16],['Commuting', 7], ['Orientation', 9]\n  ]]",
            "options": "{ \n      seriesDefaults: {\n        // Make this a pie chart.\n        renderer: $.jqplot.PieRenderer, \n        rendererOptions: {\n          // Put data labels on the pie slices.\n          // By default, labels show the percentage of the slice.\n          showDataLabels: true\n        }\n      }, \n      legend: { show: true, location: 'e' }\n    }",
            "chartHeight": 300,
            "chartWidth": 600,
            "height": 5
          }
        }
      ]
    },
    {
      "title": "line style options",
      "width": 1,
      "row": {
        "3": 13,
        "4": 13,
        "5": 13
      },
      "col": {
        "3": 2,
        "4": 3,
        "5": 3
      },
      "col_width": 2,
      "widgets": [
        {
          "type": "jqPlotWidget",
          "settings": {
            "id": "chart6",
            "data": " var cosPoints = [];\n  for (var i=0; i<2*Math.PI; i+=0.4){ \n    cosPoints.push([i, Math.cos(i)]); \n  }\n    \n  var sinPoints = []; \n  for (var i=0; i<2*Math.PI; i+=0.4){ \n     sinPoints.push([i, 2*Math.sin(i-.8)]); \n  }\n    \n  var powPoints1 = []; \n  for (var i=0; i<2*Math.PI; i+=0.4) { \n      powPoints1.push([i, 2.5 + Math.pow(i/4, 2)]); \n  }\n    \n  var powPoints2 = []; \n  for (var i=0; i<2*Math.PI; i+=0.4) { \n      powPoints2.push([i, -2.5 - Math.pow(i/4, 2)]); \n  } \n\n\n\n\nreturn [cosPoints, sinPoints, powPoints1, powPoints2];",
            "options": "",
            "chartHeight": 300,
            "chartWidth": 600,
            "height": 5
          }
        }
      ]
    }
  ],
  "datasources": [],
  "columns": 5
}