Merge pull request #222 from nestalk/master

Update d3 definition

d3/d3-tests.ts

@@ -26,4 +26,104 @@ d3.select("body").transition()
 d3.selectAll("circle").transition()
     .duration(750)
     .delay(function (d, i) { return i * 10; })
-    .attr("r", function (d) { return Math.sqrt(d * scale); });
+    .attr("r", function (d) { return Math.sqrt(d * scale); });
+
+function testOrdinalScale() {
+    var x = d3.scale.ordinal().range(["foo", "bar"]);
+    x.domain([0, 1]);
+    var result = x(0);
+
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangePoints([120, 0]);
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangePoints([120, 0], 1);
+
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeBands([120, 0]);
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeBands([120, 0], .2);
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeBands([120, 0], .2, .1);
+
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeRoundBands([0, 100]);
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeRoundBands([0, 100], .2);
+    var x = d3.scale.ordinal().domain(["a", "b", "c"]).rangeRoundBands([120, 0], .2, .1);
+}
+
+
+function testKeys() {
+    var x = d3.keys({ a: 1, b: 1 });
+
+    function abc() {
+        this.a = 1;
+        this.b = 2;
+    }
+    var x = d3.keys(new abc());
+}
+
+function testSVGArc() {
+    var a = d3.svg.arc().innerRadius(100).outerRadius(200);
+    var a = d3.svg.arc().outerRadius(100).startAngle(0).endAngle(Math.PI);
+
+    var f = function () => {
+        return 42;
+    }
+    var a = d3.svg.arc().innerRadius(0).outerRadius(f).startAngle(f).endAngle(f() * 2)
+
+    var str = a();
+    var str = a({ outerRadius: 50 });
+    var str = a.outerRadius(100)();
+    var str = a.endAngle(Math.PI / 2)()
+    var str = a({ startAngle: Math.PI / 2 });
+
+    var c = d3.svg.arc().innerRadius(0).outerRadius(100).startAngle(0).endAngle(2 * Math.PI).centroid();
+    var num = c[0];
+}
+
+function testPieLayout() {
+    var p = d3.layout.pie().sort(null).value(function (d) { return d.value; });
+    var data = [1, 2, 3, 4];
+    var arcs = p(data);
+}
+
+//Example from http://bl.ocks.org/3887235
+function testPieChart() {
+    var width = 960,
+    height = 500,
+    radius = Math.min(width, height) / 2;
+
+    var color = d3.scale.ordinal()
+        .range(["#98abc5", "#8a89a6", "#7b6888", "#6b486b", "#a05d56", "#d0743c", "#ff8c00"]);
+
+    var arc = d3.svg.arc()
+        .outerRadius(radius - 10)
+        .innerRadius(0);
+
+    var pie = d3.layout.pie()
+        .sort(null)
+        .value(function (d) { return d.population; });
+
+    var svg = d3.select("body").append("svg")
+        .attr("width", width)
+        .attr("height", height)
+      .append("g")
+        .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")");
+
+    d3.csv("data.csv", function (error, data) {
+
+        data.forEach(function (d) {
+            d.population = +d.population;
+        });
+
+        var g = svg.selectAll(".arc")
+            .data(pie(data))
+          .enter().append("g")
+            .attr("class", "arc");
+
+        g.append("path")
+            .attr("d", arc)
+            .style("fill", function (d) { return color(d.data.age); });
+
+        g.append("text")
+            .attr("transform", function (d) { return "translate(" + arc.centroid(d) + ")"; })
+            .attr("dy", ".35em")
+            .style("text-anchor", "middle")
+            .text(function (d) { return d.data.age; });
+
+    });
+}

d3/d3.d.ts

@@ -53,7 +53,7 @@ interface ID3Base extends ID3Selectors {
     };
     html: (url: string, callback: (response: DocumentFragment) => void) => void;
     csv: {
-        (url: string, callback: (response: any[]) => void);
+        (url: string, callback: (error: any, response: any[]) => void);
         parse(string: string): any[];
         parseRows(string: string, accessor: (row: any[], index: number) => any): any;
         format(rows: any[]): string;
@@ -62,6 +62,11 @@ interface ID3Base extends ID3Selectors {
     time: ID3Time;
     scale: {
         linear(): ID3LinearScale;
+        ordinal(): ID3OrdinalScale;
+        category10(): ID3OrdinalScale;
+        category20(): ID3OrdinalScale;
+        category20b(): ID3OrdinalScale;
+        category20c(): ID3OrdinalScale;
     };
     interpolate: ID3BaseInterpolate;
     interpolateNumber: ID3BaseInterpolate;
@@ -75,6 +80,7 @@ interface ID3Base extends ID3Selectors {
     layout: ID3Layout;
     svg: ID3Svg;
     random: ID3Random;
+    keys(map: Object): any[];
 }
 
 interface ID3Selection extends ID3Selectors {
@@ -220,6 +226,21 @@ interface ID3LinearScale {
     copy: ID3LinearScale;
 }
 
+interface ID3OrdinalScale {
+    (value: any): any;
+    domain(values: any[]): ID3OrdinalScale;
+    range: {
+        (values: any[]): ID3OrdinalScale;
+        (): any[];
+    };
+    rangePoints(interval: any[], padding?: number): ID3OrdinalScale;
+    rangeBands(interval: any[], padding?: number, outerPadding?: number): ID3OrdinalScale;
+    rangeRoundBands(interval: any[], padding?: number, outerPadding?: number): ID3OrdinalScale;
+    rangeBand(): any[];
+    rangeExtent(): any[];
+    copy: ID3OrdinalScale;
+}
+
 interface ID3TimeScale {
     (value: Date): number;
     invert(value: number): Date;
@@ -255,6 +276,7 @@ interface ID3Interpolate {
 
 interface ID3Layout {
     stack(): ID3StackLayout;
+    pie(): ID3PieLayout;
 }
 
 interface ID3StackLayout {
@@ -263,7 +285,34 @@ interface ID3StackLayout {
     offset(offset: string): ID3StackLayout;
 }
 
+interface ID3PieLayout {
+    (values: any[], index?: number): ID3ArcDescriptor[];
+    value: {
+        (): (d: any, index: number) => number;
+        (accessor: (d: any, index: number) => number): ID3PieLayout;
+    };
+    sort: {
+        (): (d1: any, d2: any) => number;
+        (comparator: (d1: any, d2: any) => number): ID3PieLayout;
+    };
+    startAngle: {
+        (): number;
+        (angle: number): ID3SvgArc;
+        (angle: () => number): ID3SvgArc;
+    };
+    endAngle: {
+        (): number;
+        (angle: number): ID3SvgArc;
+        (angle: () => number): ID3SvgArc;
+    };
+}
 
+interface ID3ArcDescriptor {
+    value: any;
+    data: any;
+    startAngle: number;
+    endAngle: number;
+}
 
 interface ID3SVGSymbol
 {
@@ -274,6 +323,7 @@ interface ID3SVGSymbol
 interface ID3Svg {
     symbol: ()=> ID3SVGSymbol;
     axis(): ID3SvgAxis;
+    arc(): ID3SvgArc;
 }
 
 interface ID3SvgAxis {
@@ -298,6 +348,38 @@ interface ID3SvgAxis {
     tickFormat(formatter: (value: any) => string): ID3SvgAxis;
 }
 
+interface ID3SvgArc {
+    (options?: ID3SvgArcOptions): string;
+    innerRadius: {
+        (): number;
+        (radius: number): ID3SvgArc;
+        (radius: () => number): ID3SvgArc;
+    };
+    outerRadius: {
+        (): number;
+        (radius: number): ID3SvgArc;
+        (radius: () => number): ID3SvgArc;
+    };
+    startAngle: {
+        (): number;
+        (angle: number): ID3SvgArc;
+        (angle: () => number): ID3SvgArc;
+    };
+    endAngle: {
+        (): number;
+        (angle: number): ID3SvgArc;
+        (angle: () => number): ID3SvgArc;
+    };
+    centroid(options?: ID3SvgArcOptions): number[];
+}
+
+interface ID3SvgArcOptions {
+    innerRadius?: number;
+    outerRadius?: number;
+    startAngle?: number;
+    endAngle?: number;
+}
+
 interface ID3Random {
     normal(mean?: number, deviation?: number): () => number;
 }