diff --git a/dcjs/dc-1.6.0.d.ts b/dcjs/dc-1.6.0.d.ts new file mode 100644 index 000000000..2b06c34dd --- /dev/null +++ b/dcjs/dc-1.6.0.d.ts @@ -0,0 +1,199 @@ +// Type definitions for DCJS +// Project: https://github.com/dc-js +// Definitions by: hans windhoff +// Definitions: https://github.com/borisyankov/DefinitelyTyped + +// this makes only sense together with d3 and crossfilter so you need the d3.d.ts and crossfilter.d.ts files + +/// +/// + + + +declare module dc { + + // helper for get/set situation + interface IGetSet { + (): T; + (t:T): V; + } +export interface ILegendwidget { + x: IGetSet; + y: IGetSet; + gap: IGetSet; + itemHeight: IGetSet; + horizontal: IGetSet; + legendWidth: IGetSet; + itemWidth: IGetSet; + } + export interface IBaseChart { + width: IGetSet; + height: IGetSet; + minWidth: IGetSet; + minHeight: IGetSet; + dimension: IGetSet; + group: IGetSet; // not sure here + transitionDuration: IGetSet; + colors: IGetSet; + keyAccessor: IGetSet<(d:any) => number, T>; + valueAccessor: IGetSet<(d:any) => number, T>; + label: IGetSet<(l:any) => string, T>; + renderLabel: IGetSet; + renderlet: (fnctn: (t:T) => void) => T; + title: IGetSet<(t:string) => string, T>; + filter: IGetSet; + filterAll: () => void; + expireCache: () => void; + legend: (l:ILegendwidget) => T; + chartID: () => number; + options: (o:Object)=>void ; + select: (selector: D3.Selection) => D3.Selection; + selectAll: (selector: D3.Selection) => D3.Selection; + } + + export interface IEvents { + trigger(fnctn: () => void, delay?: number):void; + } + + export var events: IEvents; + + export interface IListener { + on: (eventName: string, fnctn: (c:T) => void) => T; + } + + export interface ImarginObj { + top: number; + right: number; + bottom: number; + left: number; + + } + + export interface IMarginable { + margins: IGetSet; + } + + // abstract interfaces + export interface IAbstractColorChart { + colorDomain: IGetSet; + } + export interface IAbstractStackableChart { + stack: (group: IChartGroup, name?:string, retriever?: (d:Object)=>number) => T; + } + + export interface IAbstractCoordinateGridChart { + x: IGetSet; + y: IGetSet; + elasticY: IGetSet; + xAxis: IGetSet; + yAxis: IGetSet; + yAxisPadding: IGetSet; + xAxisPadding: IGetSet; + renderHorizontalGridLines: IGetSet; + + } + + export interface IAbstractBubblechart { + r: IGetSet; + radiusValueAccessor: IGetSet<(d:any) => number, T>; + } + + + + // function interfaces + export interface columnFunction { + (rowinfo:any): string; + } + export interface sortbyFunction { + (rowinfo:any): any; + } + export interface orderFunction { + (a: T, b: T): number; + } + + + // chart interfaces + + + export interface IBubblechart extends + IBaseChart, + IAbstractColorChart, + IAbstractBubblechart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + } + + export interface IPiechart extends + IBaseChart, + IAbstractColorChart, + IAbstractBubblechart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + radius: IGetSet; + minAngleForLabel: IGetSet; + + } + + export interface IBarchart extends + IBaseChart, + IAbstractStackableChart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + centerBar: (b:boolean) => IBarchart; + gap: (gapBetweenBars: number) => IBarchart; + } + + export interface ILinechart extends + IBaseChart, + IAbstractStackableChart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + } + + + export interface IDatachart extends + IBaseChart, + IAbstractStackableChart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + size: IGetSet; + columns: IGetSet; + sortBy: IGetSet; + order: IGetSet; + } + + + export interface IRowchart extends + IBaseChart, + IAbstractColorChart, + IAbstractStackableChart, + IAbstractCoordinateGridChart, + IMarginable, + IListener { + } + + + + + // utilities + export interface IChartGroup { } + + export function filterAll(chartGroup?: IChartGroup): void; + export function renderAll(chartGroup?: IChartGroup): void; + export function redrawAll(chartGroup?: IChartGroup): void; + + + export function bubbleChart(cssSel: string): IBubblechart; + export function pieChart(cssSel: string): IPiechart; + export function barChart(cssSel: string): IBarchart; + export function lineChart(cssSel: string): ILinechart; + export function dataTable(cssSel: string): IDatachart; + export function rowChart(cssSel: string): IRowchart; + + +} diff --git a/dcjs/dc-tests.ts b/dcjs/dc-tests.ts index 60d3aa059..91b1dc77d 100644 --- a/dcjs/dc-tests.ts +++ b/dcjs/dc-tests.ts @@ -3,240 +3,221 @@ /// interface IYelpData { - city: string; - review_count: number; - name: string; - neighborhoods: string[]; - type: string; - business_id: string; - full_address: string; - state: string; - longitude: number; - stars: number; - latitude: number; - open: boolean; - categories: string[] + city: string; + review_count: number; + name: string; + neighborhoods: string[]; + type: string; + business_id: string; + full_address: string; + state: string; + longitude: number; + stars: number; + latitude: number; + open: boolean; + categories: string[] } interface IYelpDataExtended { - count: number; - review_sum: number; - star_sum: number; - review_avg: number; - star_avg: number; + count: number; + review_sum: number; + star_sum: number; + review_avg: number; + star_avg: number; } /******************************************************** -* * -* dj.js example using Yelp Kaggle Test Dataset * -* Eamonn O'Loughlin 9th May 2013 * -* * -********************************************************/ + * * + * dj.js example using Yelp Kaggle Test Dataset * + * Eamonn O'Loughlin 9th May 2013 * + * * + ********************************************************/ /******************************************************** -* * -* Step0: Load data from json file * -* * -********************************************************/ -d3.json("data/yelp_test_set_business.json", function (yelp_data:IYelpData[]) { - -/******************************************************** -* * -* Step1: Create the dc.js chart objects & ling to div * -* * -********************************************************/ -var bubbleChart = dc.bubbleChart("#dc-bubble-graph"); -var pieChart = dc.pieChart("#dc-pie-graph"); -var volumeChart = dc.barChart("#dc-volume-chart"); -var lineChart = dc.lineChart("#dc-line-chart"); -var dataTable = dc.dataTable("#dc-table-graph"); -var rowChart = dc.rowChart("#dc-row-graph"); + * * + * Step0: Load data from json file * + * * + ********************************************************/ +d3.json("data/yelp_test_set_business.json", (yelp_data:IYelpData[]) => { -/******************************************************** -* * -* Step2: Run data through crossfilter * -* * -********************************************************/ -var ndx = crossfilter(yelp_data); - -/******************************************************** -* * -* Step3: Create Dimension that we'll need * -* * -********************************************************/ + /******************************************************** + * * + * Step1: Create the dc.js chart objects & ling to div * + * * + ********************************************************/ + var bubbleChart: DC.BubbleChart = dc.bubbleChart("#dc-bubble-graph"); + var pieChart: DC.PieChart = dc.pieChart("#dc-pie-graph"); + var volumeChart: DC.BarChart = dc.barChart("#dc-volume-chart"); + var lineChart: DC.LineChart = dc.lineChart("#dc-line-chart"); + var dataTable: DC.DataTableWidget = dc.dataTable("#dc-table-graph"); + var rowChart: DC.RowChart = dc.rowChart("#dc-row-graph"); - // for volumechart - var cityDimension = ndx.dimension(function (d) { return d.city; }); - var cityGroup = cityDimension.group(); - var cityDimensionGroup = cityDimension.group().reduce( - //add - function(p: IYelpDataExtended,v:IYelpData){ - ++p.count; - p.review_sum += v.review_count; - p.star_sum += v.stars; - p.review_avg = p.review_sum / p.count; - p.star_avg = p.star_sum / p.count; - return p; - }, - //remove - function(p: IYelpDataExtended,v:IYelpData){ - --p.count; - p.review_sum -= v.review_count; - p.star_sum -= v.stars; - p.review_avg = p.review_sum / p.count; - p.star_avg = p.star_sum / p.count; - return p; - }, - //init - function(){ - return {count:0, review_sum: 0, star_sum: 0, review_avg: 0, star_avg: 0}; - } - ); + /******************************************************** + * * + * Step2: Run data through crossfilter * + * * + ********************************************************/ + var ndx: CrossFilter.CrossFilter = crossfilter(yelp_data); - // for pieChart - var startValue = ndx.dimension(function (d) { - return d.stars*1.0; - }); - var startValueGroup = startValue.group(); + /******************************************************** + * * + * Step3: Create Dimension that we'll need * + * * + ********************************************************/ - // For datatable - var businessDimension = ndx.dimension(function (d) { return d.business_id; }); -/******************************************************** -* * -* Step4: Create the Visualisations * -* * -********************************************************/ - - bubbleChart.width(650) - .height(300) - .dimension(cityDimension) - .group(cityDimensionGroup) - .transitionDuration(1500) - .colors(["#a60000","#ff0000", "#ff4040","#ff7373","#67e667","#39e639","#00cc00"]) - .colorDomain([-12000, 12000]) - - .x(d3.scale.linear().domain([0, 5.5])) - .y(d3.scale.linear().domain([0, 5.5])) - .r(d3.scale.linear().domain([0, 2500])) - .keyAccessor(function (p) { - return p.value.star_avg; - }) - .valueAccessor(function (p) { - return p.value.review_avg; - }) - .radiusValueAccessor(function (p) { - return p.value.count; - }) - .transitionDuration(1500) - .elasticY(true) - .yAxisPadding(1) - .xAxisPadding(1) - .label(function (p) { - return p.key; - }) - .renderLabel(true) - .renderlet(function (chart) { - rowChart.filter(chart.filter()); - }) - .on("postRedraw", function (chart) { - dc.events.trigger(function () { - rowChart.filter(chart.filter()); - }); - }); - ; + // for volumechart + var cityDimension: CrossFilter.Dimension = ndx.dimension((d: IYelpData) => d.city); + var cityGroup: CrossFilter.Group = cityDimension.group(); + var cityDimensionGroup: CrossFilter.Group = cityDimension.group().reduce( + //add + (p: IYelpDataExtended, v:IYelpData) => { + ++p.count; + p.review_sum += v.review_count; + p.star_sum += v.stars; + p.review_avg = p.review_sum / p.count; + p.star_avg = p.star_sum / p.count; + return p; + }, + //remove + (p: IYelpDataExtended, v:IYelpData) => { + --p.count; + p.review_sum -= v.review_count; + p.star_sum -= v.stars; + p.review_avg = p.review_sum / p.count; + p.star_avg = p.star_sum / p.count; + return p; + }, + //init + () => { + return {count: 0, review_sum: 0, star_sum: 0, review_avg: 0, star_avg: 0}; + } + ); + // for pieChart + var startValue: CrossFilter.Dimension = ndx.dimension((d: IYelpData) => d.stars * 1.0); + var startValueGroup: CrossFilter.Group = startValue.group(); -pieChart.width(200) - .height(200) - .transitionDuration(1500) - .dimension(startValue) - .group(startValueGroup) - .radius(90) - .minAngleForLabel(0) - .label(function(d) { return d.data.key; }) - .on("filtered", function (chart) { - dc.events.trigger(function () { - if(chart.filter()) { - console.log(chart.filter()); - volumeChart.filter([chart.filter()-.25,chart.filter()-(-0.25)]); - } - else volumeChart.filterAll(); - }); - }); + // For datatable + var businessDimension: CrossFilter.Dimension = ndx.dimension((d: IYelpData) => d.business_id); + /******************************************************** + * * + * Step4: Create the Visualisations * + * * + ********************************************************/ -volumeChart.width(230) - .height(200) - .dimension(startValue) - .group(startValueGroup) - .transitionDuration(1500) - .centerBar(true) - .gap(17) - .x(d3.scale.linear().domain([0.5, 5.5])) - .elasticY(true) - .on("filtered", function (chart) { - dc.events.trigger(function () { - if(chart.filter()) { - console.log(chart.filter()); - lineChart.filter(chart.filter()); - } - else - {lineChart.filterAll()} - }); - }) - .xAxis().tickFormat(function(v) {return v;}); + bubbleChart + .width(650) + .height(300) + .dimension(cityDimension) + .group(cityDimensionGroup) + .transitionDuration(1500) + .colors(["#a60000","#ff0000", "#ff4040","#ff7373","#67e667","#39e639","#00cc00"]) + .colorDomain([-12000, 12000]) + .x(d3.scale.linear().domain([0, 5.5])) + .y(d3.scale.linear().domain([0, 5.5])) + .r(d3.scale.linear().domain([0, 2500])) + .keyAccessor((p: any) => p.value.star_avg) + .valueAccessor((p: any) => p.value.review_avg) + .radiusValueAccessor((p: any) => p.value.count) + .transitionDuration(1500) + .elasticY(true) + .yAxisPadding(1) + .xAxisPadding(1) + .label((p: any) => p.key) + .renderLabel(true) + .renderlet((chart: DC.BubbleChart) => rowChart.filter(chart.filter())) + .on("postRedraw", (chart: DC.BubbleChart) => dc.events.trigger(() => rowChart.filter(chart.filter()))); -console.log(startValueGroup.top(1)[0].value); + pieChart + .width(200) + .height(200) + .transitionDuration(1500) + .dimension(startValue) + .group(startValueGroup) + .radius(90) + .minAngleForLabel(0) + .label((d: any) => d.data.key) + .on("filtered", (chart: DC.PieChart) => + dc.events.trigger(() => { + if (chart.filter()) { + console.log(chart.filter()); + volumeChart.filter([chart.filter()-.25,chart.filter()-(-0.25)]); + } + else volumeChart.filterAll(); + })); -lineChart.width(230) - .height(200) - .dimension(startValue) - .group(startValueGroup) - .x(d3.scale.linear().domain([0.5, 5.5])) - .valueAccessor(function(d) { - return d.value; - }) - .renderHorizontalGridLines(true) - .elasticY(true) - .xAxis().tickFormat(function(v) {return v;}); ; + volumeChart + .width(230) + .height(200) + .dimension(startValue) + .group(startValueGroup) + .transitionDuration(1500) + .centerBar(true) + .gap(17) + .x(d3.scale.linear().domain([0.5, 5.5])) + .elasticY(true) + .on("filtered", (chart: DC.BarChart) => + dc.events.trigger(() => { + if(chart.filter()) { + console.log(chart.filter()); + lineChart.filter(chart.filter()); + } + else { + lineChart.filterAll() + } + })) + .xAxis() + .tickFormat((v: string) => v); -rowChart.width(340) - .height(850) - .dimension(cityDimension) - .group(cityGroup) - .renderLabel(true) - .colors(["#a60000","#ff0000", "#ff4040","#ff7373","#67e667","#39e639","#00cc00"]) - .colorDomain([0, 0]) - .renderlet(function (chart) { - bubbleChart.filter(chart.filter()); - }) - .on("filtered", function (chart) { - dc.events.trigger(function () { - bubbleChart.filter(chart.filter()); - }); - }); + console.log(startValueGroup.top(1)[0].value); + lineChart + .width(230) + .height(200) + .dimension(startValue) + .group(startValueGroup) + .x(d3.scale.linear().domain([0.5, 5.5])) + .valueAccessor((d: any) => d.value) + .renderHorizontalGridLines(true) + .elasticY(true) + .xAxis() + .tickFormat((v: string) => v); -dataTable.width(800).height(800) - .dimension(businessDimension) - .group(function(d:Object) { return "List of all Selected Businesses" - }) - .size(100) - .columns([ - function(d) { return d.name; }, - function(d) { return d.city; }, - function(d) { return d.stars; }, - function(d) { return d.review_count; }, - function(d) { return 'Map"} - ]) - .sortBy(function(d){ return d.stars; }) - // (optional) sort order, :default ascending - .order(d3.ascending); -/******************************************************** -* * -* Step6: Render the Charts * -* * -********************************************************/ - - dc.renderAll(); + rowChart + .width(340) + .height(850) + .dimension(cityDimension) + .group(cityGroup) + .renderLabel(true) + .colors(["#a60000","#ff0000", "#ff4040","#ff7373","#67e667","#39e639","#00cc00"]) + .colorDomain([0, 0]) + .renderlet((chart: DC.RowChart) => bubbleChart.filter(chart.filter())) + .on("filtered", (chart: DC.RowChart) => + dc.events.trigger(() => + bubbleChart.filter(chart.filter()))); + + dataTable + .width(800) + .height(800) + .dimension(businessDimension) + .group((d: any) => "List of all Selected Businesses") + .size(100) + .columns([ + (d: IYelpData) => d.name, + (d: IYelpData) => d.city, + (d: IYelpData) => d.stars, + (d: IYelpData) => d.review_count, + (d: IYelpData) => 'Map" + ]) + .sortBy((d: IYelpData) => d.stars) + // (optional) sort order, :default ascending + .order(d3.ascending); + /******************************************************** + * * + * Step6: Render the Charts * + * * + ********************************************************/ + + dc.renderAll(); }); diff --git a/dcjs/dc.d.ts b/dcjs/dc.d.ts index 2b06c34dd..5a83b5c7c 100644 --- a/dcjs/dc.d.ts +++ b/dcjs/dc.d.ts @@ -1,6 +1,6 @@ // Type definitions for DCJS -// Project: https://github.com/dc-js -// Definitions by: hans windhoff +// Project: https://github.com/dc-js/dc.js +// Definitions by: hans windhoff , matt traynham // Definitions: https://github.com/borisyankov/DefinitelyTyped // this makes only sense together with d3 and crossfilter so you need the d3.d.ts and crossfilter.d.ts files @@ -8,192 +8,426 @@ /// /// +declare module DC { + // helper for get/set situation + export interface IGetSet { + (): T; + (t: T): V; + } + export interface IBiGetSet { + (): T; + (t: T, r?: R): V; + } -declare module dc { + export interface Accessor { + (datum: T, index?: number): V; + } - // helper for get/set situation - interface IGetSet { - (): T; - (t:T): V; - } -export interface ILegendwidget { - x: IGetSet; - y: IGetSet; - gap: IGetSet; - itemHeight: IGetSet; - horizontal: IGetSet; - legendWidth: IGetSet; - itemWidth: IGetSet; - } - export interface IBaseChart { - width: IGetSet; - height: IGetSet; - minWidth: IGetSet; - minHeight: IGetSet; - dimension: IGetSet; - group: IGetSet; // not sure here - transitionDuration: IGetSet; - colors: IGetSet; - keyAccessor: IGetSet<(d:any) => number, T>; - valueAccessor: IGetSet<(d:any) => number, T>; - label: IGetSet<(l:any) => string, T>; - renderLabel: IGetSet; - renderlet: (fnctn: (t:T) => void) => T; - title: IGetSet<(t:string) => string, T>; - filter: IGetSet; - filterAll: () => void; - expireCache: () => void; - legend: (l:ILegendwidget) => T; - chartID: () => number; - options: (o:Object)=>void ; - select: (selector: D3.Selection) => D3.Selection; - selectAll: (selector: D3.Selection) => D3.Selection; - } + export interface UnitFunction { + (start: number, end: number, domain?: Array): number|Array; + } - export interface IEvents { - trigger(fnctn: () => void, delay?: number):void; - } + export interface FloatPointUnits { + precision(precision: number): UnitFunction; + } - export var events: IEvents; + export interface Units { + integers: UnitFunction; + ordinal: UnitFunction; + fp: FloatPointUnits; + } - export interface IListener { - on: (eventName: string, fnctn: (c:T) => void) => T; - } + export interface Events { + trigger(fn: () => void, delay?: number): void; + } - export interface ImarginObj { - top: number; - right: number; - bottom: number; - left: number; - - } + export interface Errors { + Exception(msg: string): void; + InvalidStateException(msg: string): void; + } - export interface IMarginable { - margins: IGetSet; - } + export interface Filter { + isFiltered(value: any): boolean; + } - // abstract interfaces - export interface IAbstractColorChart { - colorDomain: IGetSet; - } - export interface IAbstractStackableChart { - stack: (group: IChartGroup, name?:string, retriever?: (d:Object)=>number) => T; - } + export interface Filters { + RangedFilter(low: any, high: any): Filter; + TwoDimensionalFilter(arr: Array): Filter; + RangedTwoDimensionalFilter(arr: Array): Filter; + } - export interface IAbstractCoordinateGridChart { - x: IGetSet; - y: IGetSet; - elasticY: IGetSet; - xAxis: IGetSet; - yAxis: IGetSet; - yAxisPadding: IGetSet; - xAxisPadding: IGetSet; - renderHorizontalGridLines: IGetSet; - - } + export interface Logger { + enableDebugLog: boolean; + warn(msg: string): void; + debug(msg: string): void; + deprecate(fn: Function, msg: string): void; + } - export interface IAbstractBubblechart { - r: IGetSet; - radiusValueAccessor: IGetSet<(d:any) => number, T>; - } + export interface Printers { + filters(filters: Array): string; + filter(filter: any): string; + } + export interface Round { + floor(n: number): number; + ceil(n: number): number; + round(n: number): number; + } + export interface Utils { + printSingleValue(filter: any): string; + add(l: any, r: any): any; + subtract(l: any, r: any): any; + isNumber(n: any): boolean; + isFloat(n: any): boolean; + isInteger(n: any): boolean; + isNegligible(n: any): boolean; + clamp(n: number, min: number, max: number): number; + uniqueId(): number; + nameToId(name: string): string; + appendOrSelect(parent: D3.Selection, selector: string, tag: any): D3.Selection; + safeNumber(n: any): number; + } - // function interfaces - export interface columnFunction { - (rowinfo:any): string; - } - export interface sortbyFunction { - (rowinfo:any): any; - } - export interface orderFunction { - (a: T, b: T): number; - } + export interface Legend { + x: IGetSet; + y: IGetSet; + gap: IGetSet; + itemHeight: IGetSet; + horizontal: IGetSet; + legendWidth: IGetSet; + itemWidth: IGetSet; + autoItemWidth: IGetSet; + render: () => void; + } + export interface BaseMixin { + width: IGetSet; + height: IGetSet; + minWidth: IGetSet; + minHeight: IGetSet; + dimension: IGetSet; + data: IGetSet<(group: any) => Array, T>; + group: IGetSet; + ordering: IGetSet, T>; + filterAll(): void; + select(selector: D3.Selection|string): D3.Selection; + selectAll(selector: D3.Selection|string): D3.Selection; + anchor(anchor: BaseMixin|D3.Selection|string, chartGroup?: string): D3.Selection; + anchorName(): string; + svg: IGetSet; + resetSvg(): void; + filterPrinter: IGetSet<(filters: Array) => string, T>; + turnOnControls(): void; + turnOffControls(): void; + transitionDuration: IGetSet; + render(): void; + redraw(): void; + redrawGroup(): void; + hasFilterHandler: IGetSet<(filters: Array, filter: any) => boolean, T>; + hasFilter(filter?: any): boolean; + removeFilterHandler: IGetSet<(filters: Array) => Array, T>; + addFilterHandler: IGetSet<(filters: Array) => Array, T>; + resetFilterHandler: IGetSet<(filters: Array) => Array, T>; + filter: IGetSet; + filters(): Array; + onClick(datum: any): void; + filterHandler: IGetSet<(dimension: any, filter: any) => any, T>; + keyAccessor: IGetSet, T>; + valueAccessor: IGetSet, T>; + label: IGetSet, T>; + renderLabel: IGetSet; + title: IGetSet, T>; + renderTitle: IGetSet; + chartGroup: IGetSet; + expireCache(): T; + legend: IGetSet; + options(optionsObject: any): T; + renderlet(fn: (chart: T) => any): T; + on(event: string, fn: (chart: T) => any): T; + } - // chart interfaces - + export interface Margins { + left: number; + top: number; + right: number; + bottom: number; + } - export interface IBubblechart extends - IBaseChart, - IAbstractColorChart, - IAbstractBubblechart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - } + export interface MarginMixin { + margins: IGetSet + } - export interface IPiechart extends - IBaseChart, - IAbstractColorChart, - IAbstractBubblechart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - radius: IGetSet; - minAngleForLabel: IGetSet; + export interface ColorMixin { + colors: IGetSet|Array, T>; + ordinalColors(r: Array): void; + linearColors(r: Array): void; + colorAccessor: IGetSet, T>; + colorDomain: IGetSet, T>; + calculateColorDomain(): void; + getColor(datum: any, index?: number): string; + colorCalculator: IGetSet, T>; + } - } + export interface CoordinateGridMixin extends BaseMixin, MarginMixin, BaseMixin { + rangeChart: IGetSet, T>; + zoomScale: IGetSet, T>; + zoomOutRestrict: IGetSet; + g: IGetSet; + mouseZoomable: IGetSet; + chartBodyG(): D3.Selection; + x: IGetSet, T>; + xUnits: IGetSet; + xAxis: IGetSet; + elasticX: IGetSet; + xAxisPadding: IGetSet; + xUnitCount(): number; + useRightYAxis: IGetSet; + isOrdinal(): boolean; + xAxisLabel: IBiGetSet; + yAxisLabel: IBiGetSet; + y: IGetSet, T>; + yAxis: IGetSet; + elasticY: IGetSet; + renderHorizontalGridLines: IGetSet; + renderVerticalGridLines: IGetSet; + xAxisMin(): any; + xAxisMax(): any; + yAxisMin(): any; + yAxisMax(): any; + yAxisPadding: IGetSet; + round: IGetSet<(value: any) => any, T>; + clipPadding: IGetSet; + focus(range?: Array): void; + brushOn: IGetSet; + } - export interface IBarchart extends - IBaseChart, - IAbstractStackableChart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - centerBar: (b:boolean) => IBarchart; - gap: (gapBetweenBars: number) => IBarchart; - } + export interface StackMixin { + stack(group: any, name?: string, accessor?: Accessor): void; + hidableStacks: IGetSet; + hideStack(name: string): void; + showStack(name: string): void; + // title(stackName: string, titleFn: Accessor); + stackLayout: IGetSet; + } - export interface ILinechart extends - IBaseChart, - IAbstractStackableChart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - } + export interface CapMixin { + cap: IGetSet; + othersLabel: IGetSet; + othersGrouper: IGetSet<(data: Array) => Array, T>; + } + export interface BubbleMixin extends ColorMixin { + r: IGetSet, T>; + radiusValueAccessor: IGetSet, T>; + minRadiusWithLabel: IGetSet; + maxBubbleRelativeSize: IGetSet; + } - export interface IDatachart extends - IBaseChart, - IAbstractStackableChart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - size: IGetSet; - columns: IGetSet; - sortBy: IGetSet; - order: IGetSet; - } + export interface PieChart extends CapMixin, ColorMixin, BaseMixin { + slicesCap: IGetSet; + innerRadius: IGetSet; + radius: IGetSet; + cx: IGetSet; + cy: IGetSet; + minAngleForLabel: IGetSet; + } + export interface BarChart extends StackMixin, CoordinateGridMixin { + centerBar: IGetSet; + barPadding: IGetSet; + outerPadding: IGetSet; + gap: IGetSet; + alwaysUseRounding: IGetSet; + } - export interface IRowchart extends - IBaseChart, - IAbstractColorChart, - IAbstractStackableChart, - IAbstractCoordinateGridChart, - IMarginable, - IListener { - } + export interface RenderDataPointOptions { + fillOpacity: number; + strokeOpacity: number; + radius: number; + } + export interface LineChart extends StackMixin, CoordinateGridMixin { + interpolate: IGetSet; + tension: IGetSet; + defined: IGetSet, LineChart>; + dashStyle: IGetSet, LineChart>; + renderArea: IGetSet; + dotRadius: IGetSet; + renderDataPoints: IGetSet; + } + export interface DataCountWidgetHTML { + all: string; + some: string; + } + export interface DataCountWidget extends BaseMixin { + html: IGetSet; + formatNumber: IGetSet, DataCountWidget>; + } - // utilities - export interface IChartGroup { } + export interface DataTableWidget extends BaseMixin { + size: IGetSet; + columns: IGetSet|string|Array|string>>, DataTableWidget>; + sortBy: IGetSet, DataTableWidget>; + order: IGetSet<(a: any, b: any) => number, DataTableWidget>; + } - export function filterAll(chartGroup?: IChartGroup): void; - export function renderAll(chartGroup?: IChartGroup): void; - export function redrawAll(chartGroup?: IChartGroup): void; + export interface DataGridWidget extends BaseMixin { + size: IGetSet; + html: IGetSet, DataTableWidget>; + htmlGroup: IGetSet, DataTableWidget>; + sortBy: IGetSet, DataTableWidget>; + order: IGetSet<(a: any, b: any) => number, DataTableWidget>; + } + export interface BubbleChart extends BubbleMixin, CoordinateGridMixin { + elasticRadius: IGetSet; + } - export function bubbleChart(cssSel: string): IBubblechart; - export function pieChart(cssSel: string): IPiechart; - export function barChart(cssSel: string): IBarchart; - export function lineChart(cssSel: string): ILinechart; - export function dataTable(cssSel: string): IDatachart; - export function rowChart(cssSel: string): IRowchart; + export interface CompositeChart extends CoordinateGridMixin { + useRightAxisGridLines: IGetSet; + childOptions: IGetSet; + rightYAxisLabel: IGetSet; + compose: IGetSet>, CompositeChart>; + children(): Array>; + shareColors: IGetSet; + shareTitle: IGetSet; + rightY: IGetSet, CompositeChart>; + rightYAxis: IGetSet; + } + export interface SeriesChart extends CompositeChart { + chart: IGetSet<(c: any) => BaseMixin, SeriesChart>; + seriesAccessor: IGetSet, SeriesChart>; + seriesSort: IGetSet<(a: any, b: any) => number, SeriesChart>; + valueSort: IGetSet<(a: any, b: any) => number, SeriesChart>; + } + export interface GeoChoroplethLayer { + name: string; + keyAccessor: Accessor; + data: any; + } + + export interface GeoChoroplethChart extends ColorMixin, BaseMixin { + overlayGeoJson(json: any, name: string, keyAccessor: Accessor): void; + projection: IGetSet; + geoJsons(): Array; + geoPath(): D3.Geo.Path; + removeGeoJson(name: string): void; + } + + export interface BubbleOverlayChart extends BubbleMixin, BaseMixin { + point(name: string, x: number, y: number): void; + } + + export interface RowChart extends CapMixin, MarginMixin, ColorMixin, BaseMixin { + x: IGetSet, RowChart>; + renderTitleLabel: IGetSet; + xAxis: IGetSet; + fixedBarHeight: IGetSet; + gap: IGetSet; + elasticX: IGetSet; + labelOffsetX: IGetSet; + labelOffsetY: IGetSet; + titleLabelOffsetX: IGetSet; + } + + export interface ScatterPlot extends CoordinateGridMixin { + existenceAccessor: IGetSet, ScatterPlot>; + symbol: IGetSet; + symbolSize: IGetSet; + highlightedSize: IGetSet; + hiddenSize: IGetSet; + } + + export interface NumberDisplayWidgetHTML { + one: string; + some: string; + none: string; + } + + export interface NumberDisplayWidget extends BaseMixin { + html: IGetSet; + value(): string; + formatNumber: IGetSet, NumberDisplayWidget>; + } + + export interface HeatMap extends ColorMixin, MarginMixin, BaseMixin { + colsLabel: IGetSet, HeatMap>; + rowsLabel: IGetSet, HeatMap>; + rows: IGetSet, HeatMap>; + cols: IGetSet, HeatMap>; + boxOnClick: IGetSet<(d: any) => void, HeatMap>; + xAxisOnClick: IGetSet<(d: any) => void, HeatMap>; + yAxisOnClick: IGetSet<(d: any) => void, HeatMap>; + } + + export interface BoxPlot extends CoordinateGridMixin { + boxPadding: IGetSet; + outerPadding: IGetSet; + boxWidth: IGetSet; + tickFormat: IGetSet, BoxPlot>; + } + + export interface ChartRegistry { + has(chart: BaseMixin): boolean; + register(chart: BaseMixin, group?: string): void; + deregister(chart: BaseMixin, group?: string): void; + clear(group?: string): void; + list(group?: string): Array>; + } + + export interface Base { + chartRegistry: ChartRegistry; + registerChart(chart: BaseMixin, group?: string): void; + deregisterChart(chart: BaseMixin, group?: string): void; + hasChart(chart: BaseMixin): boolean; + deregisterAllCharts(group?: string): void; + filterAll(group?: string): void; + refocusAll(group?: string): void; + renderAll(group?: string): void; + redrawAll(group?: string): void; + disableTransitions: boolean; + transition(selections: D3.Selection, duration: number, callback: (s: D3.Selection) => void): void; + + units: Units; + events: Events; + errors: Errors; + instanceOfChart(object: any): boolean; + logger: Logger; + override(object: any, fnName: string, newFn: Function): void; + printers: Printers; + pluck(n: string, f?: Accessor): Accessor; + round: Round; + utils: Utils; + + legend(): Legend; + + pieChart(parent: string, chartGroup?: string): PieChart; + barChart(parent: string, chartGroup?: string): BarChart; + lineChart(parent: string, chartGroup?: string): LineChart; + dataCount(parent: string, chartGroup?: string): DataCountWidget; + dataTable(parent: string, chartGroup?: string): DataTableWidget; + dataGrid(parent: string, chartGroup?: string): DataGridWidget; + bubbleChart(parent: string, chartGroup?: string): BubbleChart; + compositeChart(parent: string, chartGroup?: string): CompositeChart; + seriesChart(parent: string, chartGroup?: string): SeriesChart; + geoChoroplethChart(parent: string, chartGroup?: string): GeoChoroplethChart; + bubbleOverlayChart(parent: string, chartGroup?: string): BubbleOverlayChart; + rowChart(parent: string, chartGroup?: string): RowChart; + scatterPlot(parent: string, chartGroup?: string): ScatterPlot; + numberDisplay(parent: string, chartGroup?: string): NumberDisplayWidget; + heatMap(parent: string, chartGroup?: string): HeatMap; + boxPlot(parent: string, chartGroup?: string): BoxPlot; + } +} + +declare var dc: DC.Base; + +declare module 'dc' { + export = dc; }