Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

New feature - doughnut charts #142

Merged
merged 3 commits into from
Aug 15, 2017
Merged

New feature - doughnut charts #142

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
78a7cce
Added pptx.charts.DOUGHNUT chart type
kyrrigle Aug 12, 2017
69a2cc1
Update README and built the bundle dist files
kyrrigle Aug 12, 2017
9d45783
Merge branch 'master' into feature/doughnut-chart
gitbrent Aug 15, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -322,7 +322,7 @@ slide.addChart({TYPE}, {DATA}, {OPTIONS});

### Chart Types
* Chart type can be any one of `pptx.charts`
* Currently: `pptx.charts.AREA`, `pptx.charts.BAR`, `pptx.charts.LINE`, `pptx.charts.PIE`
* Currently: `pptx.charts.AREA`, `pptx.charts.BAR`, `pptx.charts.LINE`, `pptx.charts.PIE`, `pptx.charts.DOUGHNUT`

### Chart Size/Formatting Options
| Option | Type | Unit | Default | Description | Possible Values |
Expand All @@ -346,6 +346,7 @@ slide.addChart({TYPE}, {DATA}, {OPTIONS});
| `titleColor` | string | | `000000` | title color | hex color code. Ex: `{ titleColor:'0088CC' }` |
| `titleFontFace` | string | | `Arial` | font face | font name. Ex: `{ titleFontFace:'Arial' }` |
| `titleFontSize` | number | points | `18` | font size | 1-256. Ex: `{ titleFontSize:12 }` |
| `holeSize` | number | percent | `50` | doughnut hole size | 1-100. Ex: `{ holeSize:50 }` |

### Chart Axis Options
| Option | Type | Unit | Default | Description | Possible Values |
Expand Down
2 changes: 1 addition & 1 deletion dist/pptxgen.bundle.js
View file
Open in desktop

Large diffs are not rendered by default.

2 changes: 1 addition & 1 deletion dist/pptxgen.bundle.js.map
View file
Open in desktop

Large diffs are not rendered by default.

21 changes: 13 additions & 8 deletions dist/pptxgen.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -95,7 +95,8 @@ var PptxGenJS = function(){
'AREA': { 'displayName':'Area Chart', 'name':'area' },
'BAR' : { 'displayName':'Bar Chart' , 'name':'bar' },
'LINE': { 'displayName':'Line Chart', 'name':'line' },
'PIE' : { 'displayName':'Pie Chart' , 'name':'pie' }
'PIE' : { 'displayName':'Pie Chart' , 'name':'pie' },
'DOUGHNUT' : { 'displayName':'Pie Chart (doughnut)' , 'name':'doughnut' }
}
//var RAINBOW_COLORS = ['8A56E2','CF56E2','E256AE','E25668','E28956','E2CF56','AEE256','68E256','56E289','56E2CF','56AEE2','5668E2'];
var PIECHART_COLORS = ['5DA5DA','FAA43A','60BD68','F17CB0','B2912F','B276B2','DECF3F','F15854','A7A7A7', '5DA5DA','FAA43A','60BD68','F17CB0','B2912F','B276B2','DECF3F','F15854','A7A7A7'];
Expand Down Expand Up @@ -1256,6 +1257,7 @@ var PptxGenJS = function(){
break;

case 'pie':
case 'doughnut':
// Use the same var name so code blocks from barChart are interchangeable
var obj = rel.data[0];

Expand All @@ -1270,7 +1272,7 @@ var PptxGenJS = function(){
*/

// 1: Start pieChart
strXml += '<c:pieChart>';
strXml += '<c:'+ rel.opts.type +'Chart>';
strXml += ' <c:varyColors val="0"/>';
strXml += '<c:ser>';
strXml += ' <c:idx val="0"/>';
Expand Down Expand Up @@ -1329,7 +1331,9 @@ var PptxGenJS = function(){
strXml += ' </a:defRPr>';
strXml += ' </a:pPr></a:p>';
strXml += ' </c:txPr>';
strXml += ' <c:dLblPos val="'+ (rel.opts.dataLabelPosition || 'inEnd') +'"/>';
if (rel.opts.type == 'pie') {
strXml += ' <c:dLblPos val="'+ (rel.opts.dataLabelPosition || 'inEnd') +'"/>';
}
strXml += ' <c:showLegendKey val="0"/>';
strXml += ' <c:showVal val="'+ (rel.opts.showValue ? "1" : "0") +'"/>';
strXml += ' <c:showCatName val="'+ (rel.opts.showLabel ? "1" : "0") +'"/>';
Expand All @@ -1350,7 +1354,7 @@ var PptxGenJS = function(){
</a:pPr>\
</a:p>\
</c:txPr>\
<c:dLblPos val="ctr"/>\
' + (rel.opts.type == 'pie' ? '<c:dLblPos val="ctr"/>' : '') + '\
<c:showLegendKey val="0"/>\
<c:showVal val="0"/>\
<c:showCatName val="1"/>\
Expand Down Expand Up @@ -1385,7 +1389,8 @@ var PptxGenJS = function(){
// 4: Close "SERIES"
strXml += ' </c:ser>';
strXml += ' <c:firstSliceAng val="0"/>';
strXml += '</c:pieChart>';
if ( rel.opts.type == 'doughnut' ) strXml += ' <c:holeSize val="' + (rel.opts.holeSize || 50) + '"/>';
strXml += '</c:'+ rel.opts.type +'Chart>';

// Done with CHART.BAR
break;
Expand Down Expand Up @@ -2943,7 +2948,7 @@ var PptxGenJS = function(){
// B: Options: misc
if ( ['bar','col'].indexOf(options.barDir || '') < 0 ) options.barDir = 'col';
// IMPORTANT: 'bestFit' will cause issues with PPT-Online in some cases, so defualt to 'ctr'!
if ( ['bestFit','b','ctr','inBase','inEnd','l','outEnd','r','t'].indexOf(options.dataLabelPosition || '') < 0 ) options.dataLabelPosition = (options.type == 'pie' ? 'bestFit' : 'ctr');
if ( ['bestFit','b','ctr','inBase','inEnd','l','outEnd','r','t'].indexOf(options.dataLabelPosition || '') < 0 ) options.dataLabelPosition = (options.type == 'pie' || options.type == 'doughnut' ? 'bestFit' : 'ctr');
if ( ['b','l','r','t','tr'].indexOf(options.legendPos || '') < 0 ) options.legendPos = 'r';
// barGrouping: "21.2.3.17 ST_Grouping (Grouping)"
if ( ['clustered','standard','stacked','percentStacked'].indexOf(options.barGrouping || '') < 0 ) options.barGrouping = 'standard';
Expand Down Expand Up @@ -2971,7 +2976,7 @@ var PptxGenJS = function(){

// D: Options: chart
options.barGapWidthPct = (!isNaN(options.barGapWidthPct) && options.barGapWidthPct >= 0 && options.barGapWidthPct <= 1000 ? options.barGapWidthPct : 150);
options.chartColors = ( Array.isArray(options.chartColors) ? options.chartColors : (options.type == 'pie' ? PIECHART_COLORS : BARCHART_COLORS) );
options.chartColors = ( Array.isArray(options.chartColors) ? options.chartColors : (options.type == 'pie' || options.type == 'doughnut' ? PIECHART_COLORS : BARCHART_COLORS) );
options.chartColorsOpacity = ( options.chartColorsOpacity && !isNaN(options.chartColorsOpacity) ? options.chartColorsOpacity : null );
//
options.border = ( options.border && typeof options.border === 'object' ? options.border : null );
Expand All @@ -2982,7 +2987,7 @@ var PptxGenJS = function(){
if ( options.dataBorder && (!options.dataBorder.pt || isNaN(options.dataBorder.pt)) ) options.dataBorder.pt = 0.75;
if ( options.dataBorder && (!options.dataBorder.color || typeof options.dataBorder.color !== 'string' || options.dataBorder.color.length != 6) ) options.dataBorder.color = 'F9F9F9';
//
options.dataLabelFormatCode = ( options.dataLabelFormatCode && typeof options.dataLabelFormatCode === 'string' ? options.dataLabelFormatCode : (options.type == 'pie' ? '0%' : '#,##0') );
options.dataLabelFormatCode = ( options.dataLabelFormatCode && typeof options.dataLabelFormatCode === 'string' ? options.dataLabelFormatCode : (options.type == 'pie' || options.type == 'doughnut' ? '0%' : '#,##0') );
//
options.lineSize = ( typeof options.lineSize === 'number' ? options.lineSize : 2 );
options.valAxisMajorUnit = ( typeof options.valAxisMajorUnit === 'number' ? options.valAxisMajorUnit : null );
Expand Down
10 changes: 8 additions & 2 deletions examples/nodejs-demo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@
// ============================================================================
const express = require('express'); // Not core - Only required for streaming
const app = express(); // Not core - Only required for streaming
var fs = require('fs');

var GIF_ANIM_FIRE = "";
var AUDIO_MP3 = "";
Expand All @@ -29,8 +30,13 @@ STARTING TEST
-------------`);

// STEP 1: Load pptxgenjs and show version to verify everything loaded correctly
//var pptx = require('../dist/pptxgen.js'); // for LOCAL TESTING
var pptx = require("pptxgenjs");
var pptx;
if (fs.existsSync('../dist/pptxgen.js')) {
pptx = require('../dist/pptxgen.js'); // for LOCAL TESTING
}
else {
pptx = require("pptxgenjs");
}
var runEveryTest = require("../examples/pptxgenjs-demo.js");
if (gConsoleLog) console.log(` * pptxgenjs version: ${pptx.getVersion()}`); // Loaded okay?

Expand Down
14 changes: 10 additions & 4 deletions examples/pptxgenjs-demo.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,12 +64,18 @@ function runEveryTest() {

function execGenSlidesFuncs(type) {
// STEP 1: Instantiate new PptxGenJS object
var pptx;
if ( NODEJS ) {
//var pptx = require('../dist/pptxgen.js'); // for LOCAL TESTING
var pptx = require("pptxgenjs");
var fs = require('fs');
if (fs.existsSync('../dist/pptxgen.js')) {
pptx = require('../dist/pptxgen.js'); // for LOCAL TESTING
}
else {
pptx = require("pptxgenjs");
}
}
else {
var pptx = new PptxGenJS();
pptx = new PptxGenJS();
}

pptx.setLayout('LAYOUT_WIDE');
Expand Down Expand Up @@ -1054,7 +1060,7 @@ function genSlides_Chart(pptx) {

// TOP-LEFT
slide.addText( '.', {x:0.5, y:0.5, w:4.2, h:3.2, fill:'F1F1F1', color:'F1F1F1'} );
slide.addChart( pptx.charts.PIE, dataChartPieStat, {x:0.5, y:0.5, w:4.2, h:3.2, showLegend:true, legendPos:'l'} );
slide.addChart( pptx.charts.DOUGHNUT, dataChartPieStat, {x:0.5, y:0.5, w:4.2, h:3.2, showLegend:true, legendPos:'l'} );

// TOP-RIGHT
slide.addText( '.', {x:5.6, y:0.5, w:3.2, h:3.2, fill:'F1F1F1', color:'F1F1F1'} );
Expand Down