diff options
author | Morgan Richomme <morgan.richomme@orange.com> | 2017-03-31 15:13:32 +0200 |
---|---|---|
committer | Morgan Richomme <morgan.richomme@orange.com> | 2017-03-31 15:24:29 +0200 |
commit | 3a625a5f4b176147e288dbee01734a666a25e34f (patch) | |
tree | d1db1369404266185a40322311c39df07564dbfc /docs/results/js/trend.js | |
parent | 82232b46489314d70c566c015bab4eac88d4e83f (diff) |
Backup of reporting status for Danube 1.0
- reporting html pages for apex, compass, fuel and joid
- text file with history of Danube scenarios
- text file of validated Danube scenarios (100% in functest)
Change-Id: If5585acc5bf56406c0c92e8b132157ed742244f1
Signed-off-by: Morgan Richomme <morgan.richomme@orange.com>
Diffstat (limited to 'docs/results/js/trend.js')
-rw-r--r-- | docs/results/js/trend.js | 75 |
1 files changed, 75 insertions, 0 deletions
diff --git a/docs/results/js/trend.js b/docs/results/js/trend.js new file mode 100644 index 000000000..f24213382 --- /dev/null +++ b/docs/results/js/trend.js @@ -0,0 +1,75 @@ +// ****************************************** +// Trend line for reporting +// based on scenario_history.txt +// where data looks like +// date,scenario,installer,detail,score +// 2016-09-22 13:12,os-nosdn-fdio-noha,apex,4/12,33.0 +// 2016-09-22 13:13,os-odl_l2-fdio-noha,apex,12/15,80.0 +// 2016-09-22 13:13,os-odl_l2-sfc-noha,apex,18/24,75.0 +// ..... +// ****************************************** +// Set the dimensions of the canvas / graph +var trend_margin = {top: 20, right: 30, bottom: 50, left: 40}, + trend_width = 300 - trend_margin.left - trend_margin.right, + trend_height = 130 - trend_margin.top - trend_margin.bottom; + +// Parse the date / time +var parseDate = d3.time.format("%Y-%m-%d %H:%M").parse; + +// Set the ranges +var trend_x = d3.time.scale().range([0, trend_width]); +var trend_y = d3.scale.linear().range([trend_height, 0]); + +// Define the axes +var trend_xAxis = d3.svg.axis().scale(trend_x) + .orient("bottom").ticks(2).tickFormat(d3.time.format("%m-%d")); + +var trend_yAxis = d3.svg.axis().scale(trend_y) + .orient("left").ticks(2); + +// Define the line +var valueline = d3.svg.line() + .x(function(d) { return trend_x(d.date); }) + .y(function(d) { return trend_y(d.score); }); + +var trend = function(container, trend_data) { + + var trend_svg = d3.select(container) + .append("svg") + .attr("width", trend_width + trend_margin.left + trend_margin.right) + .attr("height", trend_height + trend_margin.top + trend_margin.bottom) + .append("g") + .attr("transform", + "translate(" + trend_margin.left + "," + trend_margin.top + ")"); + + // Scale the range of the data + trend_x.domain(d3.extent(trend_data, function(d) { return d.date; })); + trend_y.domain([0, d3.max(trend_data, function(d) { return d.score; })]); + + // Add the X Axis + trend_svg.append("g") + .attr("class", "x axis") + .attr("transform", "translate(0," + trend_height + ")") + .call(trend_xAxis); + + // Add the Y Axis + trend_svg.append("g") + .attr("class", "y axis") + .call(trend_yAxis); + + // Add the valueline path. + trend_svg.append("path") + .attr("class", "line") + .attr("d", valueline(trend_data)) + .attr("stroke", "steelblue") + .attr("fill", "none"); + + trend_svg.selectAll(".dot") + .data(trend_data) + .enter().append("circle") + .attr("r", 2.5) + .attr("cx", function(d) { return trend_x(d.date); }) + .attr("cy", function(d) { return trend_y(d.score); }); + + return trend; +} |