Merge pull request #861 from apresmoi/feature/angle-range

[FEAT] angleRange & arcThicknessRatio properties for shapes
gitbrent · Dec 24, 2020 · 4c5cbf7 · 4c5cbf7
2 parents 3c191c9 + 7dc8aa4
commit 4c5cbf7
Show file tree

Hide file tree

Showing 11 changed files with 89 additions and 36 deletions.
diff --git a/demos/common/demos.js b/demos/common/demos.js
@@ -2651,7 +2651,8 @@ function genSlides_Shape(pptx) {
 	slide.addShape(pptx.shapes.RECTANGLE, { x: 3.0, y: 0.7, w: 1.5, h: 3.0, fill: { color: 'F38E00' }, rotate: 45 });
 	slide.addShape(pptx.shapes.OVAL, { x: 5.4, y: 0.8, w: 3.0, h: 1.5, fill: { type: 'solid', color: '0088CC' } });
 	slide.addShape(pptx.shapes.OVAL, { x: 7.7, y: 1.4, w: 3.0, h: 1.5, fill: { color: 'FF00CC' }, rotate: 90 }); // TEST: no type
-	slide.addShape(pptx.shapes.ROUNDED_RECTANGLE, { x:10 , y:2.5, w:3.0, h:1.5, r:0.2, fill:{color:'00FF00'}, line:'000000', lineSize:1 }); // TEST: DEPRECATED: `fill`,`line`,`lineSize`
+	slide.addShape(pptx.shapes.ROUNDED_RECTANGLE, { x: 10, y: 2.5, w: 3.0, h: 1.5, r: 0.2, fill: { color: '00FF00' }, line: '000000', lineSize: 1 }); // TEST: DEPRECATED: `fill`,`line`,`lineSize`
+	slide.addShape(pptx.shapes.ARC, { x: 10.75, y: 0.8, w: 1.5, h: 1.5, fill: { color: '0088CC' }, angleRange: [45, 315] });
 	//
 	slide.addShape(pptx.shapes.LINE, { x: 4.2, y: 4.4, w: 5.0, h: 0.0, line: { color: 'FF0000', width: 1, dashType: 'lgDash' } });
 	slide.addShape(pptx.shapes.LINE, { x: 4.2, y: 4.8, w: 5.0, h: 0.0, line: { color: 'FF0000', width: 2, dashType: 'dashDot' }, lineHead: 'arrow' }); // TEST: DEPRECATED: lineHead
@@ -2673,6 +2674,7 @@ function genSlides_Shape(pptx) {
 	slide.addText('OVAL (transparency:50)', { shape: pptx.shapes.OVAL, x: 5.4, y: 0.8, w: 3.0, h: 1.5, fill: { type: 'solid', color: '0088CC', transparency: 50 }, align: 'center', fontSize: 14 });
 	slide.addText('OVAL (rotate:90, transparency:75)', { shape: pptx.shapes.OVAL, x: 7.7, y: 1.4, w: 3.0, h: 1.5, fill: { type: 'solid', color: 'FF00CC', alpha: 75 }, rotate: 90, align: 'center', fontSize: 14 }); // TEST: DEPRECATED: `alpha`
 	slide.addText('ROUNDED-RECTANGLE\ndashType:dash\nrectRadius:10', { shape: pptx.shapes.ROUNDED_RECTANGLE, x: 10, y: 2.5, w: 3.0, h: 1.5, r: 0.2, fill: { color: '00FF00' }, align: 'center', fontSize: 14, line: { color: '000000', size: 1, dashType: 'dash' }, rectRadius:10 });
+	slide.addText('ARC', { shape: pptx.shapes.ARC, x: 10.75, y: 0.8, w: 1.5, h: 1.5, fill: { color: '0088CC' }, angleRange: [45, 315], line: { color:'002244', width: 1 }, fontSize: 14 });
 	//
 	slide.addText('LINE size=1', { shape: pptx.shapes.LINE, align: 'center', x: 4.15, y: 4.40, w: 5, h: 0, line: { color: 'FF0000', width: 1, dashType: 'lgDash' } });
 	slide.addText('LINE size=2', { shape: pptx.shapes.LINE, align: 'left', x: 4.15, y: 4.80, w: 5, h: 0, line: { color: 'FF0000', width: 2, dashType: 'dashDot', endArrowType: 'arrow' } });

diff --git a/dist/pptxgen.bundle.js b/dist/pptxgen.bundle.js
diff --git a/dist/pptxgen.bundle.js.map b/dist/pptxgen.bundle.js.map
diff --git a/dist/pptxgen.cjs.js b/dist/pptxgen.cjs.js
@@ -1,4 +1,4 @@
-/* PptxGenJS 3.4.0-beta @ 2020-12-24T04:18:27.361Z */
+/* PptxGenJS 3.4.0-beta @ 2020-12-24T05:34:36.422Z */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
@@ -1727,14 +1727,20 @@ function slideObjectToXml(slide) {
                 strSlideXml += "<a:xfrm" + locationAttr + ">";
                 strSlideXml += "<a:off x=\"" + x + "\" y=\"" + y + "\"/>";
                 strSlideXml += "<a:ext cx=\"" + cx + "\" cy=\"" + cy + "\"/></a:xfrm>";
-                strSlideXml +=
-                    '<a:prstGeom prst="' +
-                        slideItemObj.shape +
-                        '"><a:avLst>' +
-                        (slideItemObj.options.rectRadius
-                            ? '<a:gd name="adj" fmla="val ' + Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy)) + '"/>'
-                            : '') +
-                        '</a:avLst></a:prstGeom>';
+                strSlideXml += '<a:prstGeom prst="' + slideItemObj.shape + '"><a:avLst>';
+                if (slideItemObj.options.rectRadius) {
+                    strSlideXml += "<a:gd name=\"adj\" fmla=\"val " + Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy)) + "\"/>";
+                }
+                else if (slideItemObj.options.angleRange) {
+                    for (var i = 0; i < 2; i++) {
+                        var angle = slideItemObj.options.angleRange[i];
+                        strSlideXml += "<a:gd name=\"adj" + (i + 1) + "\" fmla=\"val " + convertRotationDegrees(angle) + "\" />";
+                    }
+                    if (slideItemObj.options.arcThicknessRatio) {
+                        strSlideXml += "<a:gd name=\"adj3\" fmla=\"val " + Math.round(slideItemObj.options.arcThicknessRatio * 50000) + "\" />";
+                    }
+                }
+                strSlideXml += '</a:avLst></a:prstGeom>';
                 // Option: FILL
                 strSlideXml += slideItemObj.options.fill ? genXmlColorSelection(slideItemObj.options.fill) : '<a:noFill/>';
                 // shape Type: LINE: line color
@@ -6069,7 +6075,7 @@ function createSvgPngPreview(rel) {
 |*|  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 |*|  SOFTWARE.
 \*/
-var VERSION = '3.4.0-beta-20201223-2218';
+var VERSION = '3.4.0-beta-pr861-20201223-2240';
 var PptxGenJS = /** @class */ (function () {
     function PptxGenJS() {
         var _this = this;

diff --git a/dist/pptxgen.es.js b/dist/pptxgen.es.js
@@ -1,4 +1,4 @@
-/* PptxGenJS 3.4.0-beta @ 2020-12-24T04:18:27.369Z */
+/* PptxGenJS 3.4.0-beta @ 2020-12-24T05:34:36.430Z */
 import JSZip from 'jszip';
 
 /**
@@ -1719,14 +1719,20 @@ function slideObjectToXml(slide) {
                 strSlideXml += "<a:xfrm" + locationAttr + ">";
                 strSlideXml += "<a:off x=\"" + x + "\" y=\"" + y + "\"/>";
                 strSlideXml += "<a:ext cx=\"" + cx + "\" cy=\"" + cy + "\"/></a:xfrm>";
-                strSlideXml +=
-                    '<a:prstGeom prst="' +
-                        slideItemObj.shape +
-                        '"><a:avLst>' +
-                        (slideItemObj.options.rectRadius
-                            ? '<a:gd name="adj" fmla="val ' + Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy)) + '"/>'
-                            : '') +
-                        '</a:avLst></a:prstGeom>';
+                strSlideXml += '<a:prstGeom prst="' + slideItemObj.shape + '"><a:avLst>';
+                if (slideItemObj.options.rectRadius) {
+                    strSlideXml += "<a:gd name=\"adj\" fmla=\"val " + Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy)) + "\"/>";
+                }
+                else if (slideItemObj.options.angleRange) {
+                    for (var i = 0; i < 2; i++) {
+                        var angle = slideItemObj.options.angleRange[i];
+                        strSlideXml += "<a:gd name=\"adj" + (i + 1) + "\" fmla=\"val " + convertRotationDegrees(angle) + "\" />";
+                    }
+                    if (slideItemObj.options.arcThicknessRatio) {
+                        strSlideXml += "<a:gd name=\"adj3\" fmla=\"val " + Math.round(slideItemObj.options.arcThicknessRatio * 50000) + "\" />";
+                    }
+                }
+                strSlideXml += '</a:avLst></a:prstGeom>';
                 // Option: FILL
                 strSlideXml += slideItemObj.options.fill ? genXmlColorSelection(slideItemObj.options.fill) : '<a:noFill/>';
                 // shape Type: LINE: line color
@@ -6061,7 +6067,7 @@ function createSvgPngPreview(rel) {
 |*|  OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
 |*|  SOFTWARE.
 \*/
-var VERSION = '3.4.0-beta-20201223-2218';
+var VERSION = '3.4.0-beta-pr861-20201223-2240';
 var PptxGenJS = /** @class */ (function () {
     function PptxGenJS() {
         var _this = this;

diff --git a/dist/pptxgen.min.js b/dist/pptxgen.min.js
diff --git a/dist/pptxgen.min.js.map b/dist/pptxgen.min.js.map
diff --git a/src/core-interfaces.ts b/src/core-interfaces.ts
@@ -468,6 +468,22 @@ export interface ShapeProps extends PositionProps {
 	 * @default 'left'
 	 */
 	align?: HAlign
+	/**
+	 * Radius (only for pptx.shapes.PIE, pptx.shapes.ARC, pptx.shapes.BLOCK_ARC)
+	 * - In the case of pptx.shapes.BLOCK_ARC you have to setup the arcThicknessRatio
+	 * - values: [0-359, 0-359]
+	 * @since v3.4.0
+	 * @default [270, 0]
+	 */
+	angleRange?: [number, number]
+	/**
+	 * Radius (only for pptx.shapes.BLOCK_ARC)
+	 * - You have to setup the angleRange values too
+	 * - values: 0.0-1.0
+	 * @since v3.4.0
+	 * @default 0.5
+	 */
+	arcThicknessRatio?: number
 	/**
 	 * Shape fill color properties
 	 * @example { color:'FF0000' } // hex string (red)

diff --git a/src/gen-xml.ts b/src/gen-xml.ts
@@ -451,14 +451,21 @@ function slideObjectToXml(slide: PresSlide | SlideLayout): string {
 				strSlideXml += `<a:xfrm${locationAttr}>`
 				strSlideXml += `<a:off x="${x}" y="${y}"/>`
 				strSlideXml += `<a:ext cx="${cx}" cy="${cy}"/></a:xfrm>`
-				strSlideXml +=
-					'<a:prstGeom prst="' +
-					slideItemObj.shape +
-					'"><a:avLst>' +
-					(slideItemObj.options.rectRadius
-						? '<a:gd name="adj" fmla="val ' + Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy)) + '"/>'
-						: '') +
-					'</a:avLst></a:prstGeom>'
+
+				strSlideXml += '<a:prstGeom prst="' + slideItemObj.shape + '"><a:avLst>'
+				if (slideItemObj.options.rectRadius) {
+					strSlideXml += `<a:gd name="adj" fmla="val ${Math.round((slideItemObj.options.rectRadius * EMU * 100000) / Math.min(cx, cy))}"/>`
+				} else if (slideItemObj.options.angleRange) {
+					for (let i = 0; i < 2; i++) {
+						const angle = slideItemObj.options.angleRange[i]
+						strSlideXml += `<a:gd name="adj${i + 1}" fmla="val ${convertRotationDegrees(angle)}" />`
+					}
+
+					if (slideItemObj.options.arcThicknessRatio) {
+						strSlideXml += `<a:gd name="adj3" fmla="val ${Math.round(slideItemObj.options.arcThicknessRatio * 50000)}" />`
+					}
+				}
+				strSlideXml += '</a:avLst></a:prstGeom>'
 
 				// Option: FILL
 				strSlideXml += slideItemObj.options.fill ? genXmlColorSelection(slideItemObj.options.fill) : '<a:noFill/>'

diff --git a/src/pptxgen.ts b/src/pptxgen.ts
@@ -85,7 +85,7 @@ import * as genMedia from './gen-media'
 import * as genTable from './gen-tables'
 import * as genXml from './gen-xml'
 
-const VERSION = '3.4.0-beta-20201223-2218'
+const VERSION = '3.4.0-beta-pr861-20201223-2240'
 
 export default class PptxGenJS implements IPresentationProps {
 	// Property getters/setters

diff --git a/types/index.d.ts b/types/index.d.ts
@@ -1264,6 +1264,22 @@ declare namespace PptxGenJS {
 		 * @default 'left'
 		 */
 		align?: HAlign
+		/**
+		 * Radius (only for pptx.shapes.PIE, pptx.shapes.ARC, pptx.shapes.BLOCK_ARC)
+		 * - In the case of pptx.shapes.BLOCK_ARC you have to setup the arcThicknessRatio
+		 * - values: [0-359, 0-359]
+		 * @since v3.4.0
+		 * @default [0, 270]
+		 */
+		angleRange?: [number, number]
+		/**
+		 * Radius (only for pptx.shapes.BLOCK_ARC)
+		 * - You have to setup the angleRange values too.
+		 * - values: 0.0-1.0
+		 * @since v3.4.0
+		 * @default 0.5
+		 */
+		arcThicknessRatio?: number
 		/**
 		 * Shape fill color properties
 		 * @example { color:'FF0000' } // hex string (red)