Allows end user to set the pivot table’s height and width by using height and width properties in pivot table respectively. The supported formats to set height and width properties are,
height property alone in-order to render the pivot table beyond its parent container height without vertical scrollbar. The parent container here would show its vertical scrollbar as soon as the component reaches beyond its dimension.The pivot table will not be displayed less than 400px, since it’s the minimum width of the component.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :width="width"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: true,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: '340px',
width: 550
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to set the height of each pivot table rows commonly using the rowHeight property in gridSettings.
By default, the
rowHeightproperty is set as 36 pixels for desktop layout and 48 pixels for mobile layout. The height of the column headers alone may vary when grouping bar feature is enabled.
In the below code sample, the rowHeight property is set as 60 pixels.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
rowHeight: 60
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to set the width of each pivot table columns commonly using the columnWidth property in gridSettings.
By default, the
columnWidthproperty is set as 110 pixels to each columns except the first column. For first column, 250 pixels and 200 pixels are set respectively with and without grouping bar.
In the below example, the columnWidth property is set as 200 pixels.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
columnWidth: 120
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to reorder a particular column header from one index to another index within the pivot table through drag-and-drop option. It can be enabled by setting the allowReordering property in gridSettings to true.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowReordering: true
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to resize the columns by clicking and dragging the right edge of the column header. While dragging, the width of the respective column will be resized immediately. To enable column resizing option, set the allowResizing property in gridSettings to true.
By default, the column resizing option is enabled. In RTL mode, user can click and drag the left edge of the header cell to resize the column.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowResizing: true
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to wrap the cell content to the next line when it exceeds the boundary of the cell width. To enable text wrap, set the allowTextWrap property in gridSettings to true.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowTextWrap: true
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to align the content of the pivot table’s row and column headers and value cells by using the textAlign and headerTextAlign properties in the columnRender event under gridSettings. The following alignments are:
Left - It allows the content to be positioned on the left.Right - It allows the content to be positioned on the right.Center - It allows the content to be positioned in the middle.Justify - It allows the content to be as flexible as possible, when the cell does not occupy the entire available area.<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: true,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
columnRender: function(args){
if(args.stackedColumns[0]){
// Content for the row headers is right-aligned here.
args.stackedColumns[0].textAlign="Right";
}
if(args.stackedColumns[1]){
// Content for the column header "FY 2015" is center-aligned here.
args.stackedColumns[1].textAlign = 'Center';
}
if(args.stackedColumns[1] && (args.stackedColumns[1].columns[0] as any)){
// Content for the column header "Q1" is right-aligned here.
(args.stackedColumns[1].columns[0] as any).textAlign = 'Right';
}
if(args.stackedColumns[1] && args.stackedColumns[1].columns[0] && (args.stackedColumns[1].columns[0] as any).columns[0]){
// Content for the value header "Units Sold" is right-aligned here.
(args.stackedColumns[1].columns[0] as any).columns[0].headerTextAlign = 'Right';
}
if(args.stackedColumns[1] && args.stackedColumns[1].columns[0] && (args.stackedColumns[1].columns[0] as any).columns[0]){
// Content for the values are left-aligned here.
(args.stackedColumns[1].columns[0] as any).columns[0].textAlign = 'Left';
}
}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows the user to fit the Pivot Table columns as wide as the content of the cell without wrapping. It auto fits all of the Pivot Table columns by invoking the autoFitColumns method from the grid instance.
<template>
<div id="app">
<ejs-pivotview id="pivotview" :dataSourceSettings="dataSourceSettings" :height="height" :dataBound="ondataBound"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: true,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
}
},
methods: {
ondataBound: function() {
let pivotGridObj = document.getElementById('pivotview').ej2_instances[0];
pivotGridObj.grid.autoFitColumns();
}
},
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The minimum width of 250 pixels is set by default with the grouping bar UI for the first column and cannot be reduced further. So, when the grouping bar is enabled, one can auto fit the Pivot Table columns by calling the
autoFitColumnsmethod from the grid instance with the parameter contained pivot table columns field name excluding first column.
<template>
<div id="app">
<ejs-pivotview id="pivotview" :dataSourceSettings="dataSourceSettings" :height="height" :showGroupingBar="showGroupingBar"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin, GroupingBar } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: true,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
showGroupingBar: true
}
},
methods: {
trend: function() {
let pivotGridObj = document.getElementById('pivotview').ej2_instances[0];
if (pivotGridObj.showGroupingBar) {
let columns = [];
for (let i = 1; i < (pivotGridObj.grid).columnModel.length; i++) {
columns.push((pivotGridObj.grid).columnModel[i].field);
}
pivotGridObj.grid.autoFitColumns(columns);
}
}
},
provide: {pivotview: [GroupingBar]}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}During initial rendering, the parameter autoFit in the columnRender event under gridSettings can be set to true to auto fit specific columns.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: true,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
columnRender: function(args){
for (let i = 0; i < args.columns.length; i++) {
args.columns[i].autoFit = true;
}
}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Allows end user to display cell border for each cells using gridLines property in gridSettings.
Available mode of grid lines are:
| Modes | Actions |
|---|---|
| Both | Displays both the horizontal and vertical grid lines. |
| None | No grid lines are displayed. |
| Horizontal | Displays the horizontal grid lines only. |
| Vertical | Displays the vertical grid lines only. |
| Default | Displays grid lines based on the theme. |
By default, pivot table renders grid lines in Both mode.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
gridLines: 'Vertical'
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Selection provides an option to highlight a row or a column or a cell. It can be done through simple mouse down or arrow keys. To enable selection in the pivot table, set the allowSelection property in gridSettings to true.
The pivot table supports two types of selection that can be set using type property in selectionSettings. The selection types are:
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { type: 'Multiple'}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The pivot table supports four types of selection mode that can be set using mode in selectionSettings. The selection modes are:
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { mode: 'Both'}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The pivot table supports two types of cell selection mode that can be set using cellSelectionMode in selectionSettings. The cell selection modes are:
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { cellSelectionMode: 'Box', type: 'Multiple', mode: 'Cell'}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}Cell selection requires
modeproperty inselectionSettingsto be Cell or Both, andtypeproperty should be Multiple.
The background-color of the selected cell can be changed using built-in CSS names. To do so, please refer to the code sample below, which shows that the selected cells are changed to a green yellow color.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { cellSelectionMode: 'Box', type: 'Multiple', mode: 'Cell'}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
/* csslint ignore:start */
.e-pivotview .e-cellselectionbackground,
.e-pivotview .e-selectionbackground,
.e-pivotview .e-grid .e-rowsheader.e-selectionbackground,
.e-pivotview .e-grid .e-columnsheader.e-selectionbackground {
background-color: greenYellow !important;
}
/* csslint ignore:end */
</style>
{% endraw %}The event cellSelected is triggered when cell selection gets completed. It provides selected cells information with its corresponding column and row headers. It has following parameters - selectedCellsInfo, currentCell and target. This event allows user to view selected cells information and user can pass those selected cells information to any external component for data binding.
<template>
<div id="app">
<ejs-pivotview :height="height" :dataSourceSettings="dataSourceSettings" :gridSettings="gridSettings" :cellSelected="cellSelected"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin, PivotCellSelectedEventArgs } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
enableSorting: true,
drilledMembers: [{ name: 'Year', items: ['FY 2015'] }, { name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { mode: 'Both', type: 'Multiple' }
}
}
},
methods: {
cellSelected: function(args: PivotCellSelectedEventArgs) {
//args.selectedCellsInfo -> get selected cells information.
//args.pivotValues -> get the pivot values of the pivot table.
},
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The event cellSelecting triggers before cell gets selected gets completed. It provides selected cells information with its corresponding column and row headers. It has following parameters - currentCell, data and cancel.
<template>
<div id="app">
<ejs-pivotview :height="height" :dataSourceSettings="dataSourceSettings" :gridSettings="gridSettings" :cellSelecting="cellSelecting"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin, PivotCellSelectedEventArgs } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
enableSorting: true,
drilledMembers: [{ name: 'Year', items: ['FY 2015'] }, { name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
allowSelection: true,
selectionSettings: { mode: 'Both', type: 'Multiple' }
}
}
},
methods: {
cellSelecting: function(args: PivotCellSelectedEventArgs) {
//args.selectedCellsInfo -> get selected cells information.
//args.pivotValues -> get the pivot values of the pivot table.
},
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The clip mode provides options to display its overflow cell content in the pivot table. It can be configured using the clipMode property in gridSettings. The pivot table supports three types of clip modes which are:
By default,
clipModevalue is set to Ellipsis.
<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
clipMode: 'Clip'
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}User can customize the pivot table cell element by using the cellTemplate property in pivot table The cellTemplate property accepts either an HTML string or the element’s ID, which can be used to append additional HTML elements to showcase each cell with custom format.
In this demo, the revenue cost for each year is represented with trend icons.
<template>
<div id="app">
<ejs-pivotview id="pivotview" ref="pivotview" :dataSourceSettings="dataSourceSettings" :height="height" :dataBound="trend" :cellTemplate="cellTemplate"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { renewableEnergy } from './datasource.js';
Vue.use(PivotViewPlugin);
var cellTemplateVue = Vue.component("cellTemplate", {
template: `<span class="template-wrap" v-html=getCellContent(data)></span>`,
data() {
return {
data: {}
};
},
methods: {
getCellContent: function (e) {
return '<span class="tempwrap sb-icon-neutral pv-icons"></span>';
}
}
});
export default {
data () {
return {
dataSourceSettings: {
dataSource: renewableEnergy,
expandAll: true,
enableSorting: true,
drilledMembers: [{ name: 'Year', items: ['FY 2015', 'FY 2017', 'FY 2018'] }],
formatSettings: [{ name: 'ProCost', format: 'C0' }],
rows: [
{ name: 'Year', caption: 'Production Year' }
],
columns: [
{ name: 'EnerType', caption: 'Energy Type' },
{ name: 'EneSource', caption: 'Energy Source' }
],
values: [
{ name: 'ProCost', caption: 'Revenue Growth' }
],
filters: []
},
height: 350,
cellTemplate: function() {
return { template: cellTemplateVue };
},
}
},
methods: {
trend: function() {
let pivotGridObj = (this.$refs.pivotview).ej2Instances;
let rowIndx;
var cTable = document.getElementsByClassName("e-table");
var colLen = pivotGridObj.pivotValues[3].length;
var cLen = cTable[3].children[0].children.length;
var rLen = cTable[3].children[1].children.length;
for (let k = 0; k < rLen; k++) {
if (pivotGridObj.pivotValues[k] && pivotGridObj.pivotValues[k][0] !== undefined) {
rowIndx = (pivotGridObj.pivotValues[k][0]).rowIndex;
break;
}
}
var rowHeaders = [].slice.call(cTable[2].children[1].querySelectorAll('td'));
var rows = pivotGridObj.dataSourceSettings.rows;
if (rowHeaders.length > 1) {
for (var i = 0, Cnt = rows; i < Cnt.length; i++) {
var fields = {};
var fieldHeaders = [];
for (var j = 0, Lnt = rowHeaders; j < Lnt.length; j++) {
var header = rowHeaders[j];
if (header.className.indexOf('e-gtot') === -1 && header.className.indexOf('e-rowsheader') > -1 && header.getAttribute('fieldname') === rows[i].name) {
var headerName = rowHeaders[j].getAttribute('fieldname') + '_' + rowHeaders[j].textContent;
fields[rowHeaders[j].textContent] = j;
fieldHeaders.push(rowHeaders[j].textContent);
}
}
if (i === 0) {
for (var rnt = 0, Lnt = fieldHeaders; rnt < Lnt.length; rnt++) {
if (rnt !== 0) {
var row = fields[fieldHeaders[rnt]];
var prevRow = fields[fieldHeaders[rnt - 1]];
for (var j = 0, ci = 1; j < cLen && ci < colLen; j++, ci++) {
var node = cTable[3].children[1].children[row].childNodes[j];
var prevNode = cTable[3].children[1].children[prevRow].childNodes[j];
var ri = node.getAttribute('index');
var prevRi = prevNode.getAttribute('index');
if (ri < pivotGridObj.pivotValues.length) {
if ((pivotGridObj.pivotValues[prevRi][ci]).value > (pivotGridObj.pivotValues[ri][ci]).value && node.querySelector('.tempwrap')) {
var trendElement = node.querySelector('.tempwrap');
trendElement.className = trendElement.className.replace('sb-icon-neutral', 'sb-icon-loss');
} else if ((pivotGridObj.pivotValues[prevRi][ci]).value < (pivotGridObj.pivotValues[ri][ci]).value && node.querySelector('.tempwrap')) {
var trendElement = node.querySelector('.tempwrap');
trendElement.className = trendElement.className.replace('sb-icon-neutral', 'sb-icon-profit');
}
}
}
}
}
}
}
}
},
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
.e-pivotview .e-columnsheader .tempwrap {
display: none;
}
.e-pivotview .e-rowsheader .tempwrap {
display: none;
}
@font-face {
font-family: 'e-pivot';
src:
url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAAKAIAAAwAgT1MvMjhUSmAAAAEoAAAAVmNtYXCs3q0zAAABkAAAAEpnbHlmdaItOwAAAegAAAE0aGVhZBRYEz0AAADQAAAANmhoZWEHmQNtAAAArAAAACRobXR4D7gAAAAAAYAAAAAQbG9jYQDAAHIAAAHcAAAACm1heHABDwBBAAABCAAAACBuYW1lc0cOBgAAAxwAAAIlcG9zdK9TctUAAAVEAAAARwABAAADUv9qAFoEAAAA//4D6gABAAAAAAAAAAAAAAAAAAAABAABAAAAAQAAT8kba18PPPUACwPoAAAAANin5zgAAAAA2KfnOAAAAAAD6gPoAAAACAACAAAAAAAAAAEAAAAEADUAAQAAAAAAAgAAAAoACgAAAP8AAAAAAAAAAQPuAZAABQAAAnoCvAAAAIwCegK8AAAB4AAxAQIAAAIABQMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUGZFZABA4jToTQNS/2oAWgPoAJYAAAABAAAAAAAABAAAAAPoAAAD6AAAA+gAAAAAAAIAAAADAAAAFAADAAEAAAAUAAQANgAAAAgACAACAADiNOI56E3//wAA4jTiOehN//8AAAAAAAAAAQAIAAgACAAAAAEAAwACAAAAAAAAACYAcgCaAAAAAQAAAAADTAPoABUAAAkBBhY7AREUFjsBMjY1ETMyNicBJiIB3f7KCw4SxxAMqgwQxhIPC/7FCBgD3/6tDyH9wAwQEAwCQCEPAVMJAAEAAAAAA+oDTAA0AAABMx8BAR8DDwMBDwMjLwwhLwE1NzUnPwEhPwQ1PwQCXgIFCQFxBAIEAgEDBAf+ogYKBQUEAwQDAwICAQIBAQYJCf3mAgEDAgEBAh4KCAQCAQICAgIDA0wBBf7VAwQJCQkJCQf+4QQGAgEBAQIDBAQFC50DBAQDAQICCuANAgECBQIDAqcMBQQDAQAAAQAAAAADTAPoABYAAAEGFREjIgYXARYyNwE2JisBETQmKwEiAYsIxhIPDAE5CRgJATUMDhPGEAyqDAPgCAz9wCEP/q0JCQFTDyECQAwQAAAAABIA3gABAAAAAAAAAAEAAAABAAAAAAABAAcAAQABAAAAAAACAAcACAABAAAAAAADAAcADwABAAAAAAAEAAcAFgABAAAAAAAFAAsAHQABAAAAAAAGAAcAKAABAAAAAAAKACwALwABAAAAAAALABIAWwADAAEECQAAAAIAbQADAAEECQABAA4AbwADAAEECQACAA4AfQADAAEECQADAA4AiwADAAEECQAEAA4AmQADAAEECQAFABYApwADAAEECQAGAA4AvQADAAEECQAKAFgAywADAAEECQALACQBIyBlLWljb25zUmVndWxhcmUtaWNvbnNlLWljb25zVmVyc2lvbiAxLjBlLWljb25zRm9udCBnZW5lcmF0ZWQgdXNpbmcgU3luY2Z1c2lvbiBNZXRybyBTdHVkaW93d3cuc3luY2Z1c2lvbi5jb20AIABlAC0AaQBjAG8AbgBzAFIAZQBnAHUAbABhAHIAZQAtAGkAYwBvAG4AcwBlAC0AaQBjAG8AbgBzAFYAZQByAHMAaQBvAG4AIAAxAC4AMABlAC0AaQBjAG8AbgBzAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAHUAcwBpAG4AZwAgAFMAeQBuAGMAZgB1AHMAaQBvAG4AIABNAGUAdAByAG8AIABTAHQAdQBkAGkAbwB3AHcAdwAuAHMAeQBuAGMAZgB1AHMAaQBvAG4ALgBjAG8AbQAAAAACAAAAAAAAAAoAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQBAgEDAQQBBQADVXAxC2Fycm93LXJpZ2h0CURvd25fU29ydAAAAA==) format('truetype');
font-weight: normal;
font-style: normal;
}
.pv-icons {
font-family: 'e-pivot';
font-style: normal;
font-variant: normal;
font-weight: normal;
text-transform: none;
line-height: 1;
}
.sb-icon-profit::before {
content: '\e234';
padding-left: 30px;
margin: auto !important;
color: #219122;
size: 20px;
}
.sb-icon-neutral::before {
content: '\e84d';
padding-left: 30px;
margin: auto !important;
color: #82b5e9;
}
.sb-icon-loss::before {
content: '\e239';
padding-left: 30px;
margin: auto !important;
color: #ff2222;
}
</style>
{% endraw %}define(["require", "exports"], function (require, exports) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var rData = [
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 46,
'ProCost': 43
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 30,
'ProCost': 29
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 125,
'ProCost': 96
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 215,
'ProCost': 123
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 263,
'ProCost': 125
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 61,
'ProCost': 50
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 31
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 133,
'ProCost': 110
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 33,
'ProCost': 65
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 37,
'ProCost': 20
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 109,
'ProCost': 96
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 266,
'ProCost': 139
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 257,
'ProCost': 143
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 79,
'ProCost': 53
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 28,
'ProCost': 48
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 128,
'ProCost': 117
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 68,
'ProCost': 48
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 26,
'ProCost': 32
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 141,
'ProCost': 98
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 281,
'ProCost': 134
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 228,
'ProCost': 107
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 73,
'ProCost': 49
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 19,
'ProCost': 44
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 149,
'ProCost': 82
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 47,
'ProCost': 58
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 25,
'ProCost': 40
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 127,
'ProCost': 93
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 216,
'ProCost': 124
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 267,
'ProCost': 100
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 52,
'ProCost': 65
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 39,
'ProCost': 33
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 142,
'ProCost': 97
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 53,
'ProCost': 49
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 23,
'ProCost': 44
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 113,
'ProCost': 106
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 270,
'ProCost': 101
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 284,
'ProCost': 105
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 62,
'ProCost': 43
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 32,
'ProCost': 26
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 133,
'ProCost': 83
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 51,
'ProCost': 65
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 13,
'ProCost': 25
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 139,
'ProCost': 101
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 297,
'ProCost': 130
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 236,
'ProCost': 119
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 57,
'ProCost': 66
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 16,
'ProCost': 27
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 110,
'ProCost': 93
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 55,
'ProCost': 49
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 32,
'ProCost': 39
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 128,
'ProCost': 120
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 290,
'ProCost': 128
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 201,
'ProCost': 105
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 55,
'ProCost': 46
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 37
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 122,
'ProCost': 118
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 69,
'ProCost': 54
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 21,
'ProCost': 41
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 140,
'ProCost': 83
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 239,
'ProCost': 121
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 283,
'ProCost': 127
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 80,
'ProCost': 40
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 33,
'ProCost': 40
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 120,
'ProCost': 81
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 41,
'ProCost': 69
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 14,
'ProCost': 21
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 144,
'ProCost': 93
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 294,
'ProCost': 146
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 217,
'ProCost': 103
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 49,
'ProCost': 44
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 36,
'ProCost': 21
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 118,
'ProCost': 115
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 56,
'ProCost': 41
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 17,
'ProCost': 36
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 140,
'ProCost': 81
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 274,
'ProCost': 109
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 284,
'ProCost': 145
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 40,
'ProCost': 49
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 12,
'ProCost': 28
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 150,
'ProCost': 115
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 73,
'ProCost': 64
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 23,
'ProCost': 47
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 102,
'ProCost': 112
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 252,
'ProCost': 112
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 222,
'ProCost': 131
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 52,
'ProCost': 46
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 35,
'ProCost': 30
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 104,
'ProCost': 101
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 46,
'ProCost': 40
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 19,
'ProCost': 31
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 118,
'ProCost': 89
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 227,
'ProCost': 130
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 226,
'ProCost': 144
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 40,
'ProCost': 52
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 19,
'ProCost': 40
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 127,
'ProCost': 91
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 70,
'ProCost': 66
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 36,
'ProCost': 21
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 144,
'ProCost': 85
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 212,
'ProCost': 130
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 210,
'ProCost': 110
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 72,
'ProCost': 56
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 13,
'ProCost': 47
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 139,
'ProCost': 98
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 59,
'ProCost': 54
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 26,
'ProCost': 21
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 120,
'ProCost': 97
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 299,
'ProCost': 124
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 240,
'ProCost': 110
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 71,
'ProCost': 61
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 40,
'ProCost': 33
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 134,
'ProCost': 111
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 33,
'ProCost': 50
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 18,
'ProCost': 25
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 139,
'ProCost': 85
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 217,
'ProCost': 141
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 252,
'ProCost': 101
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 31,
'ProCost': 42
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 15,
'ProCost': 27
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 117,
'ProCost': 112
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 34,
'ProCost': 40
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 10,
'ProCost': 43
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 110,
'ProCost': 83
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 212,
'ProCost': 137
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 222,
'ProCost': 126
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 75,
'ProCost': 49
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 31,
'ProCost': 37
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 105,
'ProCost': 98
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 72,
'ProCost': 45
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 45
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 143,
'ProCost': 92
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 272,
'ProCost': 128
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 208,
'ProCost': 136
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 48,
'ProCost': 46
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 22,
'ProCost': 27
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 150,
'ProCost': 100
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 60,
'ProCost': 43
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 15,
'ProCost': 27
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 107,
'ProCost': 97
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 204,
'ProCost': 136
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 210,
'ProCost': 111
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 65,
'ProCost': 47
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 26,
'ProCost': 45
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 112,
'ProCost': 115
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 54,
'ProCost': 66
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 31,
'ProCost': 36
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 120,
'ProCost': 112
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 261,
'ProCost': 149
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 226,
'ProCost': 124
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 72,
'ProCost': 63
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 35,
'ProCost': 33
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 144,
'ProCost': 118
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 293,
'ProCost': 118
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 237,
'ProCost': 110
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 36,
'ProCost': 50
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 36
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 120,
'ProCost': 95
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 46,
'ProCost': 59
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 31,
'ProCost': 33
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 147,
'ProCost': 96
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 230,
'ProCost': 100
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 236,
'ProCost': 104
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 60,
'ProCost': 57
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 33,
'ProCost': 41
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 140,
'ProCost': 105
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 31,
'ProCost': 55
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 30
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 117,
'ProCost': 106
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 259,
'ProCost': 127
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 294,
'ProCost': 126
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 51,
'ProCost': 63
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 21,
'ProCost': 45
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 102,
'ProCost': 108
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 77,
'ProCost': 64
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 29,
'ProCost': 26
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 140,
'ProCost': 88
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 244,
'ProCost': 144
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 213,
'ProCost': 127
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 69,
'ProCost': 40
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 30,
'ProCost': 33
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 116,
'ProCost': 103
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 79,
'ProCost': 47
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 29,
'ProCost': 37
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 116,
'ProCost': 96
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 295,
'ProCost': 108
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 225,
'ProCost': 127
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 35,
'ProCost': 57
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 37,
'ProCost': 49
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 138,
'ProCost': 118
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 80,
'ProCost': 47
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 22,
'ProCost': 42
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 131,
'ProCost': 91
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 240,
'ProCost': 115
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 275,
'ProCost': 109
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 46,
'ProCost': 42
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 40,
'ProCost': 43
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 112,
'ProCost': 105
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 35,
'ProCost': 40
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 22,
'ProCost': 31
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 119,
'ProCost': 87
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 298,
'ProCost': 148
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 200,
'ProCost': 107
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 30,
'ProCost': 42
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 22,
'ProCost': 49
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 148,
'ProCost': 88
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 37,
'ProCost': 49
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 23,
'ProCost': 29
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 130,
'ProCost': 102
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 281,
'ProCost': 129
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 228,
'ProCost': 113
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 80,
'ProCost': 60
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 39,
'ProCost': 27
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 119,
'ProCost': 93
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 42,
'ProCost': 46
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 18,
'ProCost': 37
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 126,
'ProCost': 96
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 222,
'ProCost': 150
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 228,
'ProCost': 105
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 54,
'ProCost': 49
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 16,
'ProCost': 33
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 145,
'ProCost': 110
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 35,
'ProCost': 41
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 16,
'ProCost': 38
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 118,
'ProCost': 114
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 241,
'ProCost': 110
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 281,
'ProCost': 136
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 50,
'ProCost': 66
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 23,
'ProCost': 26
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 129,
'ProCost': 98
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 78,
'ProCost': 53
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 28,
'ProCost': 31
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 147,
'ProCost': 120
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 240,
'ProCost': 100
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 232,
'ProCost': 116
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 33,
'ProCost': 49
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 18,
'ProCost': 36
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 114,
'ProCost': 113
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 52,
'ProCost': 63
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 31,
'ProCost': 25
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 129,
'ProCost': 88
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 263,
'ProCost': 111
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 241,
'ProCost': 105
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 55,
'ProCost': 60
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 13,
'ProCost': 30
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 134,
'ProCost': 107
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Hydro-electric',
'PowUnits': 33,
'ProCost': 69
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Geo-thermal',
'PowUnits': 20,
'ProCost': 31
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Free Energy',
'EneSource': 'Solar',
'PowUnits': 146,
'ProCost': 109
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Free Energy',
'EneSource': 'Wind',
'PowUnits': 241,
'ProCost': 107
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 10,
'ProCost': 30
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 38,
'ProCost': 65
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 6,
'ProCost': 24
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 72,
'ProCost': 86
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 13,
'ProCost': 20
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 34,
'ProCost': 54
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 5,
'ProCost': 20
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 12,
'ProCost': 26
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 48,
'ProCost': 57
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 8,
'ProCost': 29
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 61,
'ProCost': 97
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 19,
'ProCost': 29
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 40,
'ProCost': 47
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 7,
'ProCost': 27
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 20,
'ProCost': 24
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 45,
'ProCost': 42
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 4,
'ProCost': 25
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 72,
'ProCost': 82
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 19,
'ProCost': 29
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 32,
'ProCost': 42
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 5,
'ProCost': 20
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 20,
'ProCost': 25
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 43,
'ProCost': 66
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 8,
'ProCost': 26
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 86,
'ProCost': 87
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 16,
'ProCost': 22
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 43,
'ProCost': 54
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 6,
'ProCost': 22
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 15,
'ProCost': 20
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 40,
'ProCost': 55
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 3,
'ProCost': 24
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 60,
'ProCost': 87
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 12,
'ProCost': 29
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 37,
'ProCost': 50
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 3,
'ProCost': 20
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 17,
'ProCost': 21
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 38,
'ProCost': 53
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 8,
'ProCost': 27
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 88,
'ProCost': 92
},
{
'Date': '2/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 14,
'ProCost': 22
},
{
'Date': '3/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 31,
'ProCost': 69
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 2,
'ProCost': 22
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 16,
'ProCost': 29
},
{
'Date': '7/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 35,
'ProCost': 54
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 7,
'ProCost': 24
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 79,
'ProCost': 82
},
{
'Date': '12/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 10,
'ProCost': 29
},
{
'Date': '1/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 50,
'ProCost': 65
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 5,
'ProCost': 25
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 17,
'ProCost': 28
},
{
'Date': '5/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 46,
'ProCost': 54
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 7,
'ProCost': 27
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 63,
'ProCost': 84
},
{
'Date': '10/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 19,
'ProCost': 28
},
{
'Date': '11/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 47,
'ProCost': 52
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 8,
'ProCost': 23
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 20,
'ProCost': 28
},
{
'Date': '3/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 40,
'ProCost': 55
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 7,
'ProCost': 27
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 67,
'ProCost': 88
},
{
'Date': '8/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 20,
'ProCost': 29
},
{
'Date': '9/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 38,
'ProCost': 61
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 7,
'ProCost': 21
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 11,
'ProCost': 26
},
{
'Date': '1/1/2018',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 36,
'ProCost': 60
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 2,
'ProCost': 24
},
{
'Date': '1/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 83,
'ProCost': 90
},
{
'Date': '4/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 11,
'ProCost': 27
},
{
'Date': '5/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 49,
'ProCost': 42
},
{
'Date': '6/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 7,
'ProCost': 28
},
{
'Date': '8/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 13,
'ProCost': 25
},
{
'Date': '9/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 30,
'ProCost': 49
},
{
'Date': '10/1/2015',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 4,
'ProCost': 26
},
{
'Date': '11/1/2015',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 76,
'ProCost': 87
},
{
'Date': '2/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 19,
'ProCost': 27
},
{
'Date': '3/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 45,
'ProCost': 55
},
{
'Date': '4/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 1,
'ProCost': 23
},
{
'Date': '6/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 20,
'ProCost': 23
},
{
'Date': '7/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 34,
'ProCost': 51
},
{
'Date': '8/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 3,
'ProCost': 28
},
{
'Date': '9/1/2016',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 85,
'ProCost': 80
},
{
'Date': '12/1/2016',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 20,
'ProCost': 22
},
{
'Date': '1/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 40,
'ProCost': 51
},
{
'Date': '2/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 7,
'ProCost': 25
},
{
'Date': '4/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 15,
'ProCost': 21
},
{
'Date': '5/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 36,
'ProCost': 41
},
{
'Date': '6/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 1,
'ProCost': 27
},
{
'Date': '7/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 79,
'ProCost': 93
},
{
'Date': '10/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wastage',
'PowUnits': 11,
'ProCost': 28
},
{
'Date': '11/1/2017',
'Sector': 'Public Sector',
'EnerType': 'Biomass',
'EneSource': 'Ethanol Fuel',
'PowUnits': 41,
'ProCost': 51
},
{
'Date': '12/1/2017',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Bio-diesel',
'PowUnits': 8,
'ProCost': 28
},
{
'Date': '2/1/2018',
'Sector': 'Private Sector',
'EnerType': 'Biomass',
'EneSource': 'Wood',
'PowUnits': 20,
'ProCost': 23
}
];
exports.renewableEnergy = getClassDate(rData);
function getClassDate(data) {
var date;
for (var ln = 0, lt = data.length; ln < lt; ln++) {
date = new Date(data[ln].Date.toString());
var dtYr = date.getFullYear();
var dtMn = date.getMonth();
var dtdv = (dtMn + 1) / 3;
data[ln].Year = 'FY ' + dtYr;
data[ln].Quarter = dtdv <= 1 ? 'Q1 ' + ('FY ' + dtYr) : dtdv <= 2 ? 'Q2 ' + ('FY ' + dtYr) :
dtdv <= 3 ? 'Q3 ' + ('FY ' + dtYr) : 'Q4 ' + ('FY ' + dtYr);
data[ln].HalfYear = (dtMn + 1) / 6 <= 1 ? 'H1 ' + ('FY ' + dtYr) : 'H2' + ('FY ' + dtYr);
delete (data[ln].Date);
}
return data;
}
});The event queryCellInfo triggers while rendering row and value cells in the pivot table. It allows the user to customize the element of the current cell.
It has the following parameters:
cell - it holds the current cell infodata - it holds entire row datacolumn - it holds column information for the current cellpivotview - it holds pivot instance<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
columnWidth: 140,
queryCellInfo: function(args){
//triggers for every value cell while rendering
}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The event headerCellInfo triggers while rendering the header cells in the pivot table. It allows the user to customize the element of the current header cell.
It has the following parameters:
node - it holds the current header cell info<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
drilledMembers: [{ name: 'Country', items: ['France'] }],
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: []
},
height: 350,
gridSettings: {
columnWidth: 140,
headerCellInfo: function(args){
//triggers for every header cell while rendering
}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The event columnRender triggers while framing each columns for rendering in the pivot table. It allows the user to customize the text alignment, column visibility, autofit, re-ordering, minimum and maximum width for a specific column. It has the following parameters:
columns - It holds the leaf level columns (i.e., value headers) information.dataSourceSettings - It holds the current data source settings such as input data source, rows, columns, values, filters, format settings and so on.name - It holds the name of the event.stackedColumns - It holds the drilled columns (i.e., including column and value headers) information.<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :gridSettings="gridSettings"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
drilledMembers: [{ name: 'Country', items: ['France'] }],
filters: []
},
height: 350,
gridSettings: {
columnRender: function(args){
// Here you can customize the specific columns.
for (var i = 0; i < args.columns.length; i++) {
args.columns[i].autoFit = true;
args.columns[i].textAlign = "Right";
}
}
}
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}The event cellClick triggers while clicking a cell in the pivot table. For instance, using this event end-user can either add or remove styles, edit value and also perform any other DOM manipulations. It has the following parameters:
currentCell - It holds the current cell information.data - It holds the clicked cell’s data like axis, formatted text, actual text, row header, column header and value informations.<template>
<div id="app">
<ejs-pivotview :dataSourceSettings="dataSourceSettings" :height="height" :cellClick="cellClick"> </ejs-pivotview>
</div>
</template>
<script>
import Vue from "vue";
import { PivotViewPlugin } from "@syncfusion/ej2-vue-pivotview";
import { pivotData } from './pivotData.js';
Vue.use(PivotViewPlugin);
export default {
data () {
return {
dataSourceSettings: {
dataSource: pivotData,
expandAll: false,
columns: [{ name: 'Year', caption: 'Production Year' }, { name: 'Quarter' }],
values: [{ name: 'Sold', caption: 'Units Sold' }, { name: 'Amount', caption: 'Sold Amount' }],
rows: [{ name: 'Country' }, { name: 'Products' }],
formatSettings: [{ name: 'Amount', format: 'C0' }],
filters: [],
},
height: 350
}
}
methods: {
cellClick:function(args: any) {
//triggers on every cell click in pivot table
args.currentCell.setAttribute("style", "background-color: red;")
}
}
}
</script>
<style>
@import "@syncfusion/ej2-vue-pivotview/styles/material.css";
</style>
{% endraw %}