@syncfusion/ej2-treemap 29.1.33 → 30.1.37

package/dist/ts/treemap/model/pdf-export.ts

@@ -0,0 +1,105 @@
+import { createElement, isNullOrUndefined } from '@syncfusion/ej2-base';
+import { TreeMap} from '../../index';
+import { ExportType } from '../utils/enum';
+import { PdfPageOrientation, PdfDocument, PdfBitmap } from '@syncfusion/ej2-pdf-export';
+
+/**
+ * PdfExport module handles the export to pdf functionality for treemap.
+ *
+ * @hidden
+ */
+export class PdfExport {
+
+    /**
+     * Constructor for Maps
+     *
+     * @param {TreeMap} control - Specifies the treemap instance
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
+    constructor(control: TreeMap) {
+    }
+
+    /**
+     * This method is used to perform the export functionality for the rendered treemap.
+     *
+     * @param {TreeMap} treeMap - Specifies the treemap instance.
+     * @param {ExportType} type - Specifies the type of the document.
+     * @param {string} fileName - Specifies the name of the document.
+     * @param {PdfPageOrientation} orientation - Specifies the orientation of the PDF document to export the treemap.
+     * @param {boolean} allowDownload - Specifies whether to download the document or not.
+     * @returns {Promise} - Returns the string.
+     * @private
+     */
+    public export(treeMap: TreeMap, type: ExportType, fileName: string, orientation?: PdfPageOrientation,
+                  allowDownload ?: boolean): Promise<string> {
+
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/no-unused-vars
+        const promise: Promise<string> = new Promise((resolve: any, reject: any) => {
+            const element: HTMLCanvasElement = <HTMLCanvasElement>createElement('canvas', {
+                id: 'ej2-canvas',
+                attrs: {
+                    'width': treeMap.availableSize.width.toString(),
+                    'height': treeMap.availableSize.height.toString()
+                }
+            });
+            orientation = isNullOrUndefined(orientation) ? PdfPageOrientation.Landscape : orientation;
+            const exportElement: HTMLElement = treeMap.svgObject.cloneNode(true) as HTMLElement;
+            const backgroundElement: HTMLElement = exportElement.childNodes[0] as HTMLElement;
+            if (!isNullOrUndefined(backgroundElement)) {
+                const backgroundColor: string = backgroundElement.getAttribute('fill');
+                if ((treeMap.theme === 'Tailwind' || treeMap.theme === 'Tailwind3' || treeMap.theme === 'Bootstrap5' || treeMap.theme === 'Fluent' || treeMap.theme === 'Material3' ||
+                    treeMap.theme === 'Fluent2')
+                    && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
+                    (exportElement.childNodes[0] as HTMLElement).setAttribute('fill', 'rgba(255,255,255, 1)');
+                } else if ((treeMap.theme === 'TailwindDark' || treeMap.theme === 'Tailwind3Dark' || treeMap.theme === 'Bootstrap5Dark' || treeMap.theme === 'FluentDark' || treeMap.theme === 'Material3Dark' ||
+                    treeMap.theme === 'Fluent2Dark' || treeMap.theme === 'Fluent2HighContrast')
+                    && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
+                    (exportElement.childNodes[0] as HTMLElement).setAttribute('fill', 'rgba(0, 0, 0, 1)');
+                }
+            }
+
+            const url: string = window.URL.createObjectURL(
+                new Blob(
+                    [(new XMLSerializer()).serializeToString(exportElement)],
+                    { type: 'image/svg+xml' }
+                )
+            );
+
+            const image: HTMLImageElement = new Image();
+            const context: CanvasRenderingContext2D = element.getContext('2d');
+            image.onload = (() => {
+                context.drawImage(image, 0, 0);
+                window.URL.revokeObjectURL(url);
+
+                const document: PdfDocument = new PdfDocument();
+                let imageString: string = element.toDataURL('image/jpeg').replace('image/jpeg', 'image/octet-stream');
+                document.pageSettings.orientation = orientation;
+                imageString = imageString.slice(imageString.indexOf(',') + 1);
+                document.pages.add().graphics.drawImage(
+                    new PdfBitmap(imageString), 0, 0, (treeMap.availableSize.width - 60), treeMap.availableSize.height
+                );
+                if (allowDownload) {
+                    document.save(fileName + '.pdf');
+                    document.destroy();
+                } else {
+                    resolve(null);
+                }
+            });
+            image.src = url;
+        });
+        return promise;
+    }
+    protected getModuleName(): string {
+        // Returns te module name
+        return 'PdfExport';
+    }
+
+    /**
+     * To destroy the PdfExport.
+     *
+     * @returns {void}
+     * @private
+     */
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    public destroy(): void { }
+}

package/dist/ts/treemap/model/print.d.ts

@@ -0,0 +1,45 @@
+import { TreeMap } from '../../index';
+/**
+ * Print module handles the print functionality for treemap.
+ *
+ * @hidden
+ */
+export declare class Print {
+    /**
+     * Constructor for Maps
+     *
+     * @param {TreeMap} control - Specifies the treemap instance.
+     */
+    constructor(control: TreeMap);
+    /**
+     * This method is used to perform the print functionality in treemap.
+     *
+     * @param {TreeMap} treeMap - Specifies the treemap instance.
+     * @param { string[] | string | Element} elements - Specifies the element.
+     * @returns {void}
+     * @private
+     */
+    print(treeMap: TreeMap, elements?: string[] | string | Element): void;
+    /**
+     * To get the html string of the Maps
+     *
+     * @param {TreeMap} treeMap - Specifies the treemap instance.
+     * @param {string[] | string | Element} elements - Specifies the element
+     * @returns {Element} - Returns the element
+     * @private
+     */
+    getHTMLContent(treeMap: TreeMap, elements?: string[] | string | Element): Element;
+    /**
+     * Get module name.
+     *
+     * @returns {string} - Returns the module name.
+     */
+    protected getModuleName(): string;
+    /**
+     * To destroy the Print module.
+     *
+     * @returns {void}
+     * @private
+     */
+    destroy(): void;
+}

package/dist/ts/treemap/model/print.ts

@@ -0,0 +1,106 @@
+import { print as printFunction, createElement, isNullOrUndefined } from '@syncfusion/ej2-base';
+import { TreeMap} from '../../index';
+import { getElement } from '../utils/helper';
+import { IPrintEventArgs } from '../model/interface';
+import { beforePrint } from '../model/constants';
+
+/**
+ * Print module handles the print functionality for treemap.
+ *
+ * @hidden
+ */
+export class Print {
+
+    /**
+     * Constructor for Maps
+     *
+     * @param {TreeMap} control - Specifies the treemap instance.
+     */
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars, @typescript-eslint/no-empty-function
+    constructor(control: TreeMap) {
+    }
+
+    /**
+     * This method is used to perform the print functionality in treemap.
+     *
+     * @param {TreeMap} treeMap - Specifies the treemap instance.
+     * @param { string[] | string | Element} elements - Specifies the element.
+     * @returns {void}
+     * @private
+     */
+    public print(treeMap: TreeMap, elements?: string[] | string | Element): void {
+        const printWindow: Window = window.open('', 'print', 'height=' + window.outerHeight + ',width=' + window.outerWidth + ',tabbar=no');
+        printWindow.moveTo(0, 0);
+        printWindow.resizeTo(screen.availWidth, screen.availHeight);
+        const argsData: IPrintEventArgs = {
+            cancel: false, htmlContent: this.getHTMLContent(treeMap, elements), name: beforePrint
+        };
+        treeMap.trigger(beforePrint, argsData, () => {
+            if (!argsData.cancel) {
+                printFunction(argsData.htmlContent, printWindow);
+            }
+        });
+    }
+
+    /**
+     * To get the html string of the Maps
+     *
+     * @param {TreeMap} treeMap - Specifies the treemap instance.
+     * @param {string[] | string | Element} elements - Specifies the element
+     * @returns {Element} - Returns the element
+     * @private
+     */
+    public getHTMLContent(treeMap: TreeMap, elements?: string[] | string | Element): Element {
+        const div: Element = createElement('div');
+        if (elements) {
+            if (elements instanceof Array) {
+                elements.forEach((value: string) => {
+                    div.appendChild(getElement(value).cloneNode(true) as Element);
+                });
+            } else if (elements instanceof Element) {
+                div.appendChild(elements.cloneNode(true) as Element);
+            } else {
+                div.appendChild(getElement(elements).cloneNode(true) as Element);
+            }
+        } else {
+            const exportElement: HTMLElement = treeMap.element.cloneNode(true)  as HTMLElement;
+            // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            let backgroundElement: HTMLElement = (exportElement.getElementsByTagName('svg')[0] as any) as HTMLElement;
+            if (!isNullOrUndefined(backgroundElement)) {
+                backgroundElement = backgroundElement.childNodes[0] as HTMLElement;
+                if (!isNullOrUndefined(backgroundElement)) {
+                    const backgroundColor: string = backgroundElement.getAttribute('fill');
+                    if ((treeMap.theme === 'Tailwind' || treeMap.theme === 'Tailwind3' || treeMap.theme === 'Bootstrap5' || treeMap.theme === 'Fluent' || treeMap.theme === 'Material3' ||
+                        treeMap.theme === 'Fluent2')
+                        && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
+                        backgroundElement.setAttribute('fill', 'rgba(255,255,255, 1)');
+                    } else if ((treeMap.theme === 'TailwindDark' || treeMap.theme === 'Tailwind3Dark' || treeMap.theme === 'Bootstrap5Dark' || treeMap.theme === 'FluentDark' || treeMap.theme === 'Material3Dark' ||
+                        treeMap.theme === 'Fluent2Dark' || treeMap.theme === 'Fluent2HighContrast')
+                        && (backgroundColor === 'rgba(255,255,255, 0.0)' || backgroundColor === 'transparent')) {
+                        backgroundElement.setAttribute('fill', 'rgba(0, 0, 0, 1)');
+                    }
+                }
+            }
+            div.appendChild(exportElement as Element);
+        }
+        return div;
+    }
+
+    /**
+     * Get module name.
+     *
+     * @returns {string} - Returns the module name.
+     */
+    protected getModuleName(): string {
+        // Returns te module name
+        return 'Print';
+    }
+    /**
+     * To destroy the Print module.
+     *
+     * @returns {void}
+     * @private
+     */
+    // eslint-disable-next-line @typescript-eslint/no-empty-function
+    public destroy(): void { }
+}

package/dist/ts/treemap/model/theme.d.ts

@@ -0,0 +1,19 @@
+/**
+ * Maps Themes doc
+ */
+import { IFontMapping, IThemeStyle } from '../model/interface';
+import { TreeMapTheme } from '../utils/enum';
+export declare namespace Theme {
+    /**
+     * @private
+     */
+    const mapsTitleFont: IFontMapping;
+}
+/**
+ * To get the theme style based on treemap theme.
+ *
+ * @param {TreeMapTheme} theme Specifies the theme of the treemap control.
+ * @returns {IThemeStyle} Returns the theme.
+ * @private
+ */
+export declare function getThemeStyle(theme: TreeMapTheme): IThemeStyle;