From 8465c2b19140b4b551d5ae461bbf61713c2c1560 Mon Sep 17 00:00:00 2001 From: Scott Baker Date: Thu, 27 Mar 2014 09:11:14 -0700 Subject: [PATCH] pass dataSourceUrl to renderchart, fix date axis, more flexible option passing, Siobhan's changes to IDs --- planetstack/core/static/page_analytics.js | 24 +++-- planetstack/core/static/planetstack_graphs.js | 90 +++++++++---------- 2 files changed, 59 insertions(+), 55 deletions(-) diff --git a/planetstack/core/static/page_analytics.js b/planetstack/core/static/page_analytics.js index 017b403..75221b7 100644 --- a/planetstack/core/static/page_analytics.js +++ b/planetstack/core/static/page_analytics.js @@ -23,23 +23,28 @@ function getObjectQuery() { function setPageStatInt(labelName, valueName, legend, units, value) { - $('.'+labelName).text(legend).show(); - $('.'+valueName).text(Math.round(value)+units).show(); + $(labelName).text(legend).show(); + $(valueName).text(Math.round(value)+units).show(); } function setPageStatFloat(labelName, valueName, legend, units, value, dp) { - $('.'+labelName).text(legend).show(); - $('.'+valueName).text(Number(value).toFixed(dp)+units).show(); + $(labelName).text(legend).show(); + $(valueName).text(Number(value).toFixed(dp)+units).show(); } // ---------------------------------------------------------------------------- // node count and average cpu utilization function updatePageAnalyticsData(summaryData) { - window.pageAnalyticsData = summaryData; + window.pageAnalyticsUrl = summaryData["dataSourceUrl"]; lastRow = summaryData.rows.length-1; - setPageStatInt("nodesLabel", "nodesValue", "Node Count", "", summaryData.rows[lastRow]["count_hostname"]); - setPageStatInt("cpuLabel", "cpuValue", "Avg Load", "%", summaryData.rows[lastRow]["avg_cpu"]); + + setPageStatInt(".nodesLabel", ".nodesValue", "Node Count", "", summaryData.rows[lastRow]["count_hostname"]); + setPageStatInt(".cpuLabel", ".cpuValue", "Avg Load", "%", summaryData.rows[lastRow]["avg_cpu"]); + + //New miniDashboard + setPageStatInt("#miniDashNodeCountLabel", "#miniDashNodeCount", "Node Count", "", summaryData.rows[lastRow]["count_hostname"]); + setPageStatInt("#miniDashAvgLoadLabel", "#miniDashAvgLoad", "Avg Load", "%", summaryData.rows[lastRow]["avg_cpu"]); } function updatePageAnalytics() { @@ -61,9 +66,10 @@ setTimeout(updatePageAnalytics, 5000); // bandwidth function updatePageBandwidthData(summaryData) { - window.pageBandData = summaryData; + window.pageBandwidthUrl = summaryData["dataSourceUrl"]; lastRow = summaryData.rows.length-1; - setPageStatFloat("bandwidthLabel", "bandwidthValue", "Bandwidth", "Gbps", summaryData.rows[lastRow]["sum_computed_bytes_sent_div_elapsed"]*8.0/1024/1024/1024,2); + setPageStatFloat(".bandwidthLabel", ".bandwidthValue", "Bandwidth", " Gbps", summaryData.rows[lastRow]["sum_computed_bytes_sent_div_elapsed"]*8.0/1024/1024/1024,2); + setPageStatFloat("#miniDashBandwidthLabel", "#miniDashBandwidth", "Bandwidth", " Gbps", summaryData.rows[lastRow]["sum_computed_bytes_sent_div_elapsed"]*8.0/1024/1024/1024,2); } function updatePageBandwidth() { diff --git a/planetstack/core/static/planetstack_graphs.js b/planetstack/core/static/planetstack_graphs.js index 8177d8d..fb33022 100644 --- a/planetstack/core/static/planetstack_graphs.js +++ b/planetstack/core/static/planetstack_graphs.js @@ -1,21 +1,20 @@ google.load('visualization', '1', {'packages' : ['controls','table','corechart','geochart']}); -function renderChart(origQuery, yColumn, xColumn, title, aggFunc) { - $('#graph').empty(); - $('#chartsModal').modal('show'); - $('.modal-body').scrollTop(0) - - var queryString = encodeURIComponent(origQuery); - var serverPart = "http://cloud-scrutiny.appspot.com/command?table=demoevents&action=send_query&force=ColumnChart&q="; - var dataSourceUrl = serverPart + queryString; - - //var dataSourceUrl = "http://node36.princeton.vicci.org:8000/analytics/bigquery/?avg=%25cpu&count=%25hostname&format=raw"; - - var query = new google.visualization.Query(dataSourceUrl) +function renderChart(newStyle, dialog, container, dataSourceUrl, yColumn, xColumn, aggFunc, options) { + if ( newStyle ) { + $(dialog).dialog("open"); + } + else { + $(container).empty(); + $(dialog).modal('show'); + $('.modal-body').scrollTop(0); + } + + console.log(dataSourceUrl); + + var query = new google.visualization.Query(dataSourceUrl); query && query.abort(); - console.log("query.send") - query.send(function(response) {handleResponse_psg(response, yColumn, xColumn, title, aggFunc);}); - console.log("query.sent") + query.send(function(response) {handleResponse_psg(container, response, yColumn, xColumn, aggFunc, options);}); } // NOTE: appended _psg to showLine() and handleResponse() to prevent conflict @@ -29,39 +28,45 @@ function agg_bandwidth(arr) { return ret; } -function showLine_psg(dt, title) { - console.log("showline") - var lineChart = new google.visualization.ChartWrapper({ - 'chartType': 'LineChart', - 'containerId': 'graph', - 'options': { +function showLine_psg(container, dt, options) { + console.log("showline_psg"); + + var base_options = { 'width': 520, 'height': 300, - 'title': title, 'pages': true, 'numRows': 9, 'backgroundColor': 'transparent', - 'titleTextStyle': {"color": "white"}, + 'titleTextStyle': {"color": "black"}, 'legend': 'none', -// 'legend': {"textStyle": {"color": "white"}}, - 'hAxis': {"baselineColor": "white", - "textStyle": {"color": "white"}}, - 'vAxis': {"baselineColor": "white", - "textStyle": {"color": "white"}}, - }, - 'view': {'columns': [0, 1]} + 'hAxis': {"baselineColor": "darkBlue", + "textStyle": {"color": "black"}}, + 'vAxis': {"baselineColor": "darkBlue", + "textStyle": {"color": "black"}}, + } + + options = $.extend(true, {}, base_options, options); + + var lineChart = new google.visualization.ChartWrapper({ + 'chartType': 'LineChart', + 'containerId': container.substring(1), + 'view': {'columns': [0, 1]}, + 'options': options }); lineChart.setDataTable(dt); lineChart.draw(); + } function fixDate(unixDate) { return new Date(unixDate*1000); } -function handleResponse_psg(response, yColumn, xColumn, title, aggFunc) { - console.log("handleResponse") +function fixDate2(unixDate) { + return new Date(unixDate); +} +function handleResponse_psg(container, response, yColumn, xColumn, aggFunc, options) { var supportedClasses = { 'Table':google.visualization.Table, 'LineChart':google.visualization.LineChart, @@ -90,7 +95,7 @@ function handleResponse_psg(response, yColumn, xColumn, title, aggFunc) { var groupedData1 = google.visualization.data.group(dt, [{ column: yColumn, type: 'datetime', - modifier: fixDate, + modifier: fixDate2, }], [{ column: xColumn, @@ -98,32 +103,25 @@ function handleResponse_psg(response, yColumn, xColumn, title, aggFunc) { label: dt.getColumnLabel(xColumn), aggregation: aggFunc}]); - showLine_psg(groupedData1, title); - - console.log(xColumn); + console.log(groupedData1.getColumnRange(0)) + console.log(groupedData1.getColumnRange(1)) + showLine_psg(container, groupedData1, options); }); - console.log(response.getReasons()); - console.log(response.getDataTable()); - console.log(response.getDetailedMessage()); - console.log(response.getMessage()); - proxy.setDataTable(response.getDataTable()); proxy.draw(); } $('.nodesLabel, .nodesValue').click(function() { - var jsonData = window.pageAnalyticsData; - renderChart(jsonData.query, 0, 2, "Node Count", google.visualization.data.sum); - //renderChartJson(jsonData, "MinuteTime", "count_hostname", "Node Count"); + renderChart(false,"#chartsModal", "#graph", window.pageAnalyticsUrl, 0, "Number of Nodes", 2, "Node Count", google.visualization.data.sum); }); $('.cpuLabel, .cpuValue').click(function() { var jsonData = window.pageAnalyticsData; - renderChart(jsonData.query, 0, 1, "Average CPU", google.visualization.data.sum); + renderChart(false,"#chartsModal", "#graph", window.pageAnalyticsUrl, 0, "Average CPU", 1, "Average CPU", google.visualization.data.sum); }); $('.bandwidthLabel, .bandwidthValue').click(function() { var jsonData = window.pageBandData; - renderChart(jsonData.query, 0, 1, "Total Bandwidth", agg_bandwidth); + renderChart(false,"#chartsModal", "#graph", window.pageBandUrl, 0, "Total Bandwidth (Gbps)", 1, "Total Bandwidth", agg_bandwidth); }); -- 2.47.0