diff --git a/d3pie/d3pie-tests.ts b/d3pie/d3pie-tests.ts
new file mode 100644
index 0000000000..4d8a38280f
--- /dev/null
+++ b/d3pie/d3pie-tests.ts
@@ -0,0 +1,146 @@
+///
+
+let chart = new d3pie('test',
+ {
+ header: {
+ title: {
+ text: '',
+ color: '#333333',
+ fontSize: 18,
+ font: 'arial'
+ },
+ subtitle: {
+ color: '#666666',
+ fontSize: 14,
+ font: 'arial'
+ },
+ location: 'top-center',
+ titleSubtitlePadding: 8
+ },
+ footer: {
+ text: '',
+ color: '#666666',
+ fontSize: 14,
+ font: 'arial',
+ location: 'left'
+ },
+ size: {
+ canvasHeight: 500,
+ canvasWidth: 500,
+ pieInnerRadius: 0,
+ pieOuterRadius: null
+ },
+ data: {
+ sortOrder: 'none',
+ smallSegmentGrouping: {
+ enabled: false,
+ value: 1,
+ valueType: 'percentage',
+ label: 'Other',
+ color: '#cccccc'
+ },
+ content: []
+ },
+ labels: {
+ outer: {
+ format: 'label',
+ hideWhenLessThanPercentage: null,
+ pieDistance: 30
+ },
+ inner: {
+ format: 'percentage',
+ hideWhenLessThanPercentage: null
+ },
+ mainLabel: {
+ color: '#333333',
+ font: 'arial',
+ fontSize: 10
+ },
+ percentage: {
+ color: '#dddddd',
+ font: 'arial',
+ fontSize: 10,
+ decimalPlaces: 0
+ },
+ value: {
+ color: '#cccc44',
+ font: 'arial',
+ fontSize: 10
+ },
+ lines: {
+ enabled: true,
+ style: 'curved',
+ color: 'segment' // 'segment' or a hex color
+ }
+ },
+ effects: {
+ load: {
+ effect: 'default', // none / default
+ speed: 1000
+ },
+ pullOutSegmentOnClick: {
+ effect: 'bounce', // none / linear / bounce / elastic / back
+ speed: 300,
+ size: 10
+ },
+ highlightSegmentOnMouseover: true,
+ highlightLuminosity: -0.2
+ },
+ tooltips: {
+ enabled: false,
+ type: 'placeholder', // caption|placeholder
+ string: '',
+ placeholderParser: null,
+ styles: {
+ fadeInSpeed: 250,
+ backgroundColor: '#000000',
+ backgroundOpacity: 0.5,
+ color: '#efefef',
+ borderRadius: 2,
+ font: 'arial',
+ fontSize: 10,
+ padding: 4
+ }
+ },
+
+ misc: {
+ colors: {
+ background: null, // transparent
+ segments: [
+ '#2484c1', '#65a620', '#7b6888', '#a05d56', '#961a1a',
+ '#d8d23a', '#e98125', '#d0743c', '#635222', '#6ada6a',
+ '#0c6197', '#7d9058', '#207f33', '#44b9b0', '#bca44a',
+ '#e4a14b', '#a3acb2', '#8cc3e9', '#69a6f9', '#5b388f',
+ '#546e91', '#8bde95', '#d2ab58', '#273c71', '#98bf6e',
+ '#4daa4b', '#98abc5', '#cc1010', '#31383b', '#006391',
+ '#c2643f', '#b0a474', '#a5a39c', '#a9c2bc', '#22af8c',
+ '#7fcecf', '#987ac6', '#3d3b87', '#b77b1c', '#c9c2b6',
+ '#807ece', '#8db27c', '#be66a2', '#9ed3c6', '#00644b',
+ '#005064', '#77979f', '#77e079', '#9c73ab', '#1f79a7'
+ ],
+ segmentStroke: '#ffffff'
+ },
+ gradient: {
+ enabled: false,
+ percentage: 95,
+ color: '#000000'
+ },
+ canvasPadding: {
+ top: 5,
+ right: 5,
+ bottom: 5,
+ left: 5
+ },
+ pieCenterOffset: {
+ x: 0,
+ y: 0
+ },
+ cssPrefix: null
+ },
+ callbacks: {
+ onload: null,
+ onMouseoverSegment: null,
+ onMouseoutSegment: null,
+ onClickSegment: null
+ }
+ })
\ No newline at end of file
diff --git a/d3pie/d3pie.d.ts b/d3pie/d3pie.d.ts
new file mode 100644
index 0000000000..2bfe5d6525
--- /dev/null
+++ b/d3pie/d3pie.d.ts
@@ -0,0 +1,146 @@
+// Type definitions for d3pie 0.1.9
+// Project: https://github.com/benkeen/d3pie
+// Definitions by: Petryshyn Sergii
+// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
+
+declare namespace d3pie {
+ interface ID3PieChart {
+ redraw(): void
+ openSegment(index: number): void
+ closeSegment(index: void): void
+ getOpenSegment(): any
+ updateProp(propKey: string, value: any): void
+ destroy(): void
+ }
+
+ interface ID3PieStyleOptions {
+ color?: string
+ fontSize?: number
+ font?: string
+ }
+
+ interface ID3PieTextOptions extends ID3PieStyleOptions {
+ text?: string
+ }
+
+ interface ID3PieLabelsOptions {
+ format?: 'label' | 'value' | 'percentage' | 'label-value1' | 'label-value2' | 'label-percentage1' | 'label-percentage2'
+ hideWhenLessThanPercentage?: number
+ }
+
+ interface ID3PieOptions {
+ header?: {
+ title?: ID3PieTextOptions
+ subtitle?: ID3PieTextOptions
+ location?: 'top-center' | 'top-left' | 'pie-center'
+ titleSubtitlePadding?: number
+ }
+ footer?: { location?: 'left' } & ID3PieTextOptions
+ size?: {
+ canvasHeight?: number
+ canvasWidth?: number
+ pieOuterRadius?: string | number
+ pieInnerRadius?: string | number
+ }
+ data: {
+ sortOrder?: 'none' | 'random' | 'value-asc' | 'value-desc' | 'label-asc' | 'label-desc'
+ smallSegmentGrouping?: {
+ enabled?: boolean
+ value?: number
+ valueType?: 'percentage' | 'value'
+ label?: string
+ color?: string
+ }
+ content: {
+ label: string
+ value: number
+ color?: string
+ }[]
+ }
+ labels?: {
+ outer?: { pieDistance?: number } & ID3PieLabelsOptions
+ inner?: ID3PieLabelsOptions
+ mainLabel?: ID3PieStyleOptions
+ percentage?: { decimalPlaces?: number } & ID3PieStyleOptions
+ value?: ID3PieStyleOptions
+ lines?: {
+ enabled?: boolean
+ style?: 'curved' | 'straight'
+ color?: string
+ }
+ truncation?: {
+ enabled?: boolean
+ truncateLength?: number
+ }
+ formatter?: (context: {
+ section: 'outer' | 'inner'
+ value: number
+ label: string
+ }) => string
+ }
+ effects?: {
+ load?: {
+ effect?: 'none' | 'default'
+ speed?: number
+ }
+ pullOutSegmentOnClick?: {
+ effect?: 'none' | 'linear' | 'bounce' | 'elastic' | 'back'
+ speed?: number
+ size?: number
+ }
+ highlightSegmentOnMouseover?: boolean
+ highlightLuminosity?: number
+ }
+ tooltips?: {
+ enabled?: boolean
+ type?: 'placeholder' | 'caption'
+ string?: string
+ placeholderParser?: (index: number, data: { label?: string, percentage?: number, value?: number }) => void
+ styles?: {
+ fadeInSpeed?: number
+ backgroundColor?: string
+ backgroundOpacity?: number
+ color?: string
+ borderRadius?: number
+ font?: string
+ fontSize?: number
+ padding?: number
+ }
+ }
+ misc?: {
+ colors?: {
+ background?: string
+ segments?: string[]
+ segmentStroke?: string
+ }
+ gradient?: {
+ enabled?: boolean
+ percentage?: number
+ color?: string
+ }
+ canvasPadding?: {
+ top?: number
+ right?: number
+ bottom?: number
+ left?: number
+ }
+ pieCenterOffset?: {
+ x?: number
+ y?: number
+ }
+ cssPrefix?: string
+ }
+ callbacks?: {
+ onload?: Function
+ onMouseoverSegment?: Function
+ onMouseoutSegment?: Function
+ onClickSegment?: Function
+ }
+ }
+
+ interface ID3PieClass {
+ new (id: string | HTMLElement, options: ID3PieOptions): ID3PieChart
+ }
+}
+
+declare const d3pie: d3pie.ID3PieClass
\ No newline at end of file