Dashboard in sharepoint online - using sql azure datasource

Just wondering if anyone has done this and how did they go?
What will be the best way to present a dashboard/charts in sharepoint online from data coming from a list or sql azure?

Thanks for any info and tips in advance

May 27th, 2015 2:59am


Add reference to JQuery and Chart.js

Create a field called Status in your list with following values "Completed", "In Progress" and "Not Started"

Sample code for Chart
$(document).ready(function () {
    getItems("caml", "list title");

window.onload = function () {

var doughnutData = [{ value: 0, color: "#5AD3D1", highlight: "#5AD3D1", label: "Completed" },
                    { value: 0, color: "#FFC870", highlight: "#FFC870", label: "In Progress" },
                    { value: 0, color: "#FF5A5E", highlight: "#FF5A5E", label: "Not Started" }

function renderChart() {
    var ctx = document.getElementById("canvas1").getContext("2d");
    window.myDoughnut = new Chart(ctx).Doughnut(doughnutData, { responsive: true });

function getItems(caml, listName) {
    var endpoint = _spPageContextInfo.webAbsoluteUrl + "/_api/web/lists/GetByTitle('" + listName + "')/GetItems";
    var requestData = { query: { __metadata: { 'type': 'SP.CamlQuery' }, ViewXml: caml } };
        url: endpoint,
        type: "POST",
        data: JSON.stringify(requestData),
        headers: {
            "X-RequestDigest": $("#__REQUESTDIGEST").val(),
            "Accept": "application/json; odata=verbose",
            "Content-Type": "application/json; odata=verbose"
        success: successHandler,
        error: errorHandler

function successHandler(data) {
function errorHandler(data, errorCode, errorMessage) {

function getChartData(data) {
    if (data.length !== 0) {
        for (var i = 0; i < data.length; i++) {
            var arr = 0;
            if (data[i]['Status'] == "Completed") {
                arr = 0;
            else if (data[i]['Status'] == "In Progress") {
                arr = 1;
            else if (data[i]['Status'] == "Not Started") {
                arr = 2;
            doughnutData[arr].value = doughnutData[arr].value + 1;

Free Windows Admin Tool Kit Click here and download it now
May 27th, 2015 3:19am

Thanks Sundur I have actually chart plugins before.
I was wondering if there is a plugin in SharePoint Online that could do it.

Also can I retrieve sql azure data as API in sharepoint online


May 27th, 2015 3:39am

Hi Patrick,

I am not sure about the built-in plugin for charts in SharePoint online.

You can create External content type to pull data from SQL Azure and can use BDC REST service 


Free Windows Admin Tool Kit Click here and download it now
May 27th, 2015 3:53am

This may be useful for requirement 


May 28th, 2015 3:43am

Thanks Sundarbalu
So if the content is in Sql Azure via BCS I can still use REST?


Free Windows Admin Tool Kit Click here and download it now
May 28th, 2015 8:55pm

Thanks but this is SharePoint Online
May 28th, 2015 8:56pm

This topic is archived. No further replies will be accepted.

Other recent topics Other recent topics