Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

render pie chart example

  • Loading branch information...
commit cdb0e8308e154f28bbfab708bdb59ccc9a819230 1 parent 8b0915b
@joeferner joeferner authored
Showing with 52 additions and 0 deletions.
  1. +52 −0 lib/format/html/index.js
View
52 lib/format/html/index.js
@@ -76,6 +76,7 @@ function sortFiles(filesToSort) {
function render(filePath, templatePath, viewData, callback) {
mkdirp.sync(path.dirname(filePath));
var template = fs.readFileSync(templatePath, 'utf8');
+ viewData.renderPieChart = renderPieChart;
var html = ejs.render(template, viewData);
fs.writeFile(filePath, html, callback);
}
@@ -115,3 +116,54 @@ exports.report = function (coverageMap, outputDir, callback) {
return;
}
};
+
+function renderPieChart(percent) {
+ var size = 100;
+ var margin = 10;
+ var quadrantSize = (size - margin - margin) / 2;
+ var center = quadrantSize + margin;
+ var deg2rad = function (deg) { return deg * 3.1415 / 180.0; };
+ var x = center + (Math.cos(deg2rad(-90 + (360 * percent))) * quadrantSize);
+ var y = center + (Math.sin(deg2rad(-90 + (360 * percent))) * quadrantSize);
+ var greenDirection = percent <= 0.5 ? 0 : 1;
+ var redDirection = greenDirection === 1 ? 0 : 1;
+ var html = '';
+ html += '<svg width="' + size + '" height="' + size + '">';
+ html += ' <defs>';
+ html += ' <filter id="dropshadow" width="' + quadrantSize + '" height="' + quadrantSize + '">';
+ html += ' <feGaussianBlur stdDeviation="4"/>';
+ html += ' </filter>';
+ html += ' </defs>';
+ html += ' <circle cx="' + center + '" cy="' + center + '" r="' + quadrantSize + '"';
+ html += ' style="fill: black;';
+ html += ' fill-opacity:0.6;';
+ html += ' stroke:none;';
+ html += ' filter:url(#dropshadow)"/>';
+ if (percent > 0.9999) {
+ html += ' <circle cx="' + center + '" cy="' + center + '" r="' + quadrantSize + '"';
+ html += ' style="fill:#00ff00;';
+ html += ' fill-opacity: 1;';
+ html += ' stroke:black;';
+ html += ' stroke-width: 1;"/>';
+ } else if (percent < 0.0001) {
+ html += ' <circle cx="' + center + '" cy="' + center + '" r="' + quadrantSize + '"';
+ html += ' style="fill:#ff0000;';
+ html += ' fill-opacity: 1;';
+ html += ' stroke:black;';
+ html += ' stroke-width: 1;"/>';
+ } else {
+ html += ' <path d="M' + center + ',' + center + ' L' + center + ',' + margin + ' A' + (center - margin) + ',' + (center - margin) + ' 0 ' + greenDirection + ',1 ' + x + ',' + y + ' z"';
+ html += ' style="fill:#00ff00;';
+ html += ' fill-opacity: 1;';
+ html += ' stroke:black;';
+ html += ' stroke-width: 1"/>';
+ html += ' <path d="M' + center + ',' + center + ' L' + x + ',' + y + ' A' + (center - margin) + ',' + (center - margin) + ' 0 ' + redDirection + ',1 ' + center + ',' + margin + ' z"';
+ html += ' style="fill:#ff0000;';
+ html += ' fill-opacity: 1;';
+ html += ' stroke:black;';
+ html += ' stroke-width: 1"/>';
+ }
+ html += '</svg>';
+ return html;
+}
+;
Please sign in to comment.
Something went wrong with that request. Please try again.