@syncfusion/ej2-angular-treemap 31.2.12 → 32.1.19

package/schematics/generators/treemap-layout-type-three/schema.json

@@ -0,0 +1,125 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "EJ2SchemaTemplateID",
+  "title": "treemap-layout-type-three",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the component.",
+      "visible": false
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "name": {
+      "type": "string",
+      "description": "The name of the component.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      }
+    },
+    "inlineStyle": {
+      "description": "Specifies if the style will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Specifies if the template will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "viewEncapsulation": {
+      "description": "Specifies the view encapsulation strategy.",
+      "enum": [
+        "Emulated",
+        "Native",
+        "None",
+        "ShadowDom"
+      ],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "Specifies the change detection strategy.",
+      "enum": [
+        "Default",
+        "OnPush"
+      ],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to generated selectors.",
+      "alias": "p",
+      "oneOf": [
+        {
+          "maxLength": 0
+        },
+        {
+          "minLength": 1,
+          "format": "html-selector"
+        }
+      ]
+    },
+    "styleext": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css"
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "description": "Flag to indicate if a dir is created.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Flag to skip the module import.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The selector to use for the component."
+    },
+    "module": {
+      "type": "string",
+      "description": "Allows specification of the declaring module.",
+      "alias": "m"
+    },
+    "export": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if declaring module exports the component."
+    },
+    "entryComponent": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component is an entry component of declaring module."
+    },
+    "lintFix": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies whether to apply lint fixes after generating the component."
+    }
+  },
+  "required": [
+    "name"
+  ],
+  "id": "treemap-layout-type-three"
+}

package/schematics/generators/treemap-layout-type-three/schema.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+
+export interface Schema extends ComponentSchema { }

package/schematics/generators/treemap-layout-type-two/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/generators/treemap-layout-type-two/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const schematics_1 = require("@syncfusion/ej2-angular-base/schematics");
+const sampleDetails = require("./sample-details");
+function default_1(options) {
+    return schematics_1.componentBuilder(options, sampleDetails);
+}
+exports.default = default_1;

package/schematics/generators/treemap-layout-type-two/index.ts

@@ -0,0 +1,8 @@
+import { Rule } from '@angular-devkit/schematics';
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import { Schema } from './schema';
+import * as sampleDetails from './sample-details';
+
+export default function (options: Schema): Rule {
+  return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/treemap-layout-type-two/sample-details.d.ts

@@ -0,0 +1,5 @@
+export declare const componentName: string;
+export declare const sampleName: string;
+export declare const diModules: string;
+export declare const packageName: string;
+export declare const libModules: string;

package/schematics/generators/treemap-layout-type-two/sample-details.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.componentName = 'treemap';
+exports.sampleName = 'layout-type-two';
+exports.diModules = 'TreeMapTooltip';
+exports.packageName = '@syncfusion/ej2-angular-treemap';
+exports.libModules = 'TreeMapModule';

package/schematics/generators/treemap-layout-type-two/sample-details.ts

@@ -0,0 +1,5 @@
+export const componentName: string = 'treemap';
+export const sampleName: string = 'layout-type-two';
+export const diModules: string =  'TreeMapTooltip';
+export const packageName: string = '@syncfusion/ej2-angular-treemap';
+export const libModules: string = 'TreeMapModule';

package/schematics/generators/treemap-layout-type-two/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.css

@@ -0,0 +1,3 @@
+.control-section {
+    min-height: 450px;
+}

package/schematics/generators/treemap-layout-type-two/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -0,0 +1,8 @@
+<div class="control-section">
+    <ejs-treemap id='container' #treemap style="display:block;" [titleSettings] = 'titleSettings' [dataSource] ='dataSource' [weightValuePath] ='weightValuePath' [leafItemSettings] ='leafItemSettings'
+    [tooltipSettings] = 'tooltipSettings' layoutType ='SliceAndDiceHorizontal' [rangeColorValuePath] = 'rangeColorValuePath' (load)='load($event)'  >
+    </ejs-treemap>
+</div>
+
+    
+

package/schematics/generators/treemap-layout-type-two/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -0,0 +1,56 @@
+/* eslint-disable */
+import { Component, ViewEncapsulation, ViewChild } from '@angular/core';
+import { TreeMap, TreeMapTooltip, LayoutMode, TreeMapTheme, ILoadEventArgs } from '@syncfusion/ej2-angular-treemap';
+import { econmics } from './assets/econmics';;
+TreeMap.Inject(TreeMapTooltip);
+
+@Component({
+    selector: '<%=dasherize(selector)%>',
+    templateUrl: '<%=dasherize(name)%>.component.html',
+    styleUrls: ['<%=dasherize(name)%>.component.css'],
+    encapsulation: ViewEncapsulation.None
+})
+export class <%= classify(name) %>Component {
+    @ViewChild('treemap')
+    public treemap: TreeMap;
+    public load = (args: ILoadEventArgs) => {
+        let theme: string = location.hash.split('/')[1];
+        theme = theme ? theme : 'Material';
+        args.treemap.theme = <TreeMapTheme>(theme.charAt(0).toUpperCase() + theme.slice(1));
+    }
+        public titleSettings: object = {
+            text: 'Top 10 countries by GDP Nominal - 2015',
+            textStyle: {size: '15px'}
+        };
+        dataSource: object[] = econmics;
+        weightValuePath: string = 'GDP';
+        public tooltipSettings: object = {
+            visible: true,
+            format: '${State}<br>Rank : ${Rank}'
+
+        };
+        rangeColorValuePath: string = 'GDP';
+        public leafItemSettings: object = {
+            labelPath: 'State',
+            labelFormat: '${State}<br>$${GDP} Trillion<br>(${percentage} %)',
+            labelStyle: {
+                color: '#000000'
+            },
+            border: {
+                color: '#000000',
+                width: 0.5
+            },
+            colorMapping: [
+                {
+                    from: 1550,
+                    to: 17946,
+                    color: '#9cbb59',
+                    minOpacity: 0.7,
+                    maxOpacity: 1,
+                }
+            ]
+        };          
+      constructor() {
+          //code
+        }
+    };

package/schematics/generators/treemap-layout-type-two/samples/__path__/__name@dasherize@if-flat__/assets/econmics.ts

@@ -0,0 +1,14 @@
+
+/* eslint-disable */
+export let econmics: Object[] =[
+    {State:"United States", GDP:17946, percentage:11.08, Rank:1},	 
+    {State:"China", GDP:10866, percentage: 28.42, Rank:2},	 
+    {State:"Japan", GDP:4123, percentage:-30.78, Rank:3},	 
+    {State:"Germany", GDP:3355, percentage:-5.19, Rank:4},	 
+    {State:"United Kingdom", GDP:2848, percentage:8.28, Rank:5},	 
+    {State:"France", GDP:2421, percentage:-9.69, Rank:6},	 
+    {State:"India", GDP:2073, percentage:13.65, Rank:7},	 
+    {State:"Italy", GDP:1814, percentage:-12.45, Rank:8},	 
+    {State:"Brazil", GDP:1774, percentage:-27.88, Rank:9},	 
+    {State:"Canada", GDP:1550, percentage:-15.02, Rank:10}	 
+     ]	

package/schematics/generators/treemap-layout-type-two/schema.d.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+export interface Schema extends ComponentSchema {
+}

package/schematics/generators/treemap-layout-type-two/schema.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/schematics/generators/treemap-layout-type-two/schema.json

@@ -0,0 +1,125 @@
+{
+  "$schema": "http://json-schema.org/schema",
+  "$id": "EJ2SchemaTemplateID",
+  "title": "treemap-layout-type-two",
+  "type": "object",
+  "properties": {
+    "path": {
+      "type": "string",
+      "format": "path",
+      "description": "The path to create the component.",
+      "visible": false
+    },
+    "project": {
+      "type": "string",
+      "description": "The name of the project.",
+      "$default": {
+        "$source": "projectName"
+      }
+    },
+    "name": {
+      "type": "string",
+      "description": "The name of the component.",
+      "$default": {
+        "$source": "argv",
+        "index": 0
+      }
+    },
+    "inlineStyle": {
+      "description": "Specifies if the style will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "s"
+    },
+    "inlineTemplate": {
+      "description": "Specifies if the template will be in the ts file.",
+      "type": "boolean",
+      "default": false,
+      "alias": "t"
+    },
+    "viewEncapsulation": {
+      "description": "Specifies the view encapsulation strategy.",
+      "enum": [
+        "Emulated",
+        "Native",
+        "None",
+        "ShadowDom"
+      ],
+      "type": "string",
+      "alias": "v"
+    },
+    "changeDetection": {
+      "description": "Specifies the change detection strategy.",
+      "enum": [
+        "Default",
+        "OnPush"
+      ],
+      "type": "string",
+      "default": "Default",
+      "alias": "c"
+    },
+    "prefix": {
+      "type": "string",
+      "description": "The prefix to apply to generated selectors.",
+      "alias": "p",
+      "oneOf": [
+        {
+          "maxLength": 0
+        },
+        {
+          "minLength": 1,
+          "format": "html-selector"
+        }
+      ]
+    },
+    "styleext": {
+      "description": "The file extension to be used for style files.",
+      "type": "string",
+      "default": "css"
+    },
+    "spec": {
+      "type": "boolean",
+      "description": "Specifies if a spec file is generated.",
+      "default": true
+    },
+    "flat": {
+      "type": "boolean",
+      "description": "Flag to indicate if a dir is created.",
+      "default": false
+    },
+    "skipImport": {
+      "type": "boolean",
+      "description": "Flag to skip the module import.",
+      "default": false
+    },
+    "selector": {
+      "type": "string",
+      "format": "html-selector",
+      "description": "The selector to use for the component."
+    },
+    "module": {
+      "type": "string",
+      "description": "Allows specification of the declaring module.",
+      "alias": "m"
+    },
+    "export": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if declaring module exports the component."
+    },
+    "entryComponent": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies if the component is an entry component of declaring module."
+    },
+    "lintFix": {
+      "type": "boolean",
+      "default": false,
+      "description": "Specifies whether to apply lint fixes after generating the component."
+    }
+  },
+  "required": [
+    "name"
+  ],
+  "id": "treemap-layout-type-two"
+}

package/schematics/generators/treemap-layout-type-two/schema.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+
+export interface Schema extends ComponentSchema { }

package/schematics/generators/treemap-leaf/index.d.ts

@@ -0,0 +1,3 @@
+import { Rule } from '@angular-devkit/schematics';
+import { Schema } from './schema';
+export default function (options: Schema): Rule;

package/schematics/generators/treemap-leaf/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const schematics_1 = require("@syncfusion/ej2-angular-base/schematics");
+const sampleDetails = require("./sample-details");
+function default_1(options) {
+    return schematics_1.componentBuilder(options, sampleDetails);
+}
+exports.default = default_1;

package/schematics/generators/treemap-leaf/index.ts

@@ -0,0 +1,8 @@
+import { Rule } from '@angular-devkit/schematics';
+import { componentBuilder } from "@syncfusion/ej2-angular-base/schematics";
+import { Schema } from './schema';
+import * as sampleDetails from './sample-details';
+
+export default function (options: Schema): Rule {
+  return componentBuilder(options, sampleDetails);
+}

package/schematics/generators/treemap-leaf/sample-details.d.ts

@@ -0,0 +1,5 @@
+export declare const componentName: string;
+export declare const sampleName: string;
+export declare const diModules: string;
+export declare const packageName: string;
+export declare const libModules: string;

package/schematics/generators/treemap-leaf/sample-details.js

@@ -0,0 +1,7 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.componentName = 'treemap';
+exports.sampleName = 'leaf';
+exports.diModules = 'TreeMapTooltip';
+exports.packageName = '@syncfusion/ej2-angular-treemap';
+exports.libModules = 'TreeMapModule';

package/schematics/generators/treemap-leaf/sample-details.ts

@@ -0,0 +1,5 @@
+export const componentName: string = 'treemap';
+export const sampleName: string = 'leaf';
+export const diModules: string =  'TreeMapTooltip';
+export const packageName: string = '@syncfusion/ej2-angular-treemap';
+export const libModules: string = 'TreeMapModule';

package/schematics/generators/treemap-leaf/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.css

@@ -0,0 +1,3 @@
+.control-section {
+    min-height: 450px;
+}

package/schematics/generators/treemap-leaf/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.html

@@ -0,0 +1,8 @@
+<div class="control-section">
+    <ejs-treemap id='container' #treemap style="display:block;" [titleSettings] = 'titleSettings' [dataSource] ='dataSource' [weightValuePath] ='weightValuePath' [leafItemSettings] ='leafItemSettings'
+    [tooltipSettings] = 'tooltipSettings' layoutType ='Squarified' [rangeColorValuePath] = 'rangeColorValuePath' (load)='load($event)'  >
+    </ejs-treemap>
+</div>
+
+    
+

package/schematics/generators/treemap-leaf/samples/__path__/__name@dasherize@if-flat__/__name@dasherize__.component.ts

@@ -0,0 +1,56 @@
+/* eslint-disable */
+import { Component, ViewEncapsulation, ViewChild } from '@angular/core';
+import { TreeMap, TreeMapTooltip, LayoutMode, TreeMapTheme, ILoadEventArgs } from '@syncfusion/ej2-angular-treemap';
+import { econmics } from './assets/econmics';
+TreeMap.Inject(TreeMapTooltip);
+
+@Component({
+    selector: '<%=dasherize(selector)%>',
+    templateUrl: '<%=dasherize(name)%>.component.html',
+    styleUrls: ['<%=dasherize(name)%>.component.css'],
+    encapsulation: ViewEncapsulation.None
+})
+export class <%= classify(name) %>Component {
+    @ViewChild('treemap')
+    public treemap: TreeMap;
+    public load = (args: ILoadEventArgs) => {
+        let theme: string = location.hash.split('/')[1];
+        theme = theme ? theme : 'Material';
+        args.treemap.theme = <TreeMapTheme>(theme.charAt(0).toUpperCase() + theme.slice(1));
+    }
+        public titleSettings: object = {
+            text: 'Top 10 countries by GDP Nominal - 2015',
+            textStyle: {size: '15px'}
+        };
+        dataSource: object[] = econmics;
+        weightValuePath: string = 'GDP';
+        public tooltipSettings: object = {
+            visible: true,
+            format: '${State}<br>Rank : ${Rank}'
+
+        };
+        rangeColorValuePath: string = 'GDP';
+        public leafItemSettings: object = {
+            labelPath: 'State',
+            labelFormat: '${State}<br>$${GDP} Trillion<br>(${percentage} %)',
+            labelStyle: {
+                color: '#000000'
+            },
+            border: {
+                color: '#000000',
+                width: 0.5
+            },
+            colorMapping: [
+                {
+                    from: 1550,
+                    to: 17946,
+                    color: '#9cbb59',
+                    minOpacity: 0.7,
+                    maxOpacity: 1,
+                }
+            ]
+        };          
+      constructor() {
+          //code
+        }
+    };

package/schematics/generators/treemap-leaf/samples/__path__/__name@dasherize@if-flat__/assets/econmics.ts

@@ -0,0 +1,14 @@
+
+/* eslint-disable */
+export let econmics: Object[] =[
+    {State:"United States", GDP:17946, percentage:11.08, Rank:1},	 
+    {State:"China", GDP:10866, percentage: 28.42, Rank:2},	 
+    {State:"Japan", GDP:4123, percentage:-30.78, Rank:3},	 
+    {State:"Germany", GDP:3355, percentage:-5.19, Rank:4},	 
+    {State:"United Kingdom", GDP:2848, percentage:8.28, Rank:5},	 
+    {State:"France", GDP:2421, percentage:-9.69, Rank:6},	 
+    {State:"India", GDP:2073, percentage:13.65, Rank:7},	 
+    {State:"Italy", GDP:1814, percentage:-12.45, Rank:8},	 
+    {State:"Brazil", GDP:1774, percentage:-27.88, Rank:9},	 
+    {State:"Canada", GDP:1550, percentage:-15.02, Rank:10}	 
+     ]	

package/schematics/generators/treemap-leaf/schema.d.ts

@@ -0,0 +1,3 @@
+import { Schema as ComponentSchema } from '@schematics/angular/component/schema';
+export interface Schema extends ComponentSchema {
+}

package/schematics/generators/treemap-leaf/schema.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });