Skip to content

Commit

Permalink
Merge pull request #1790 from palantir/release-v0.51.0
Browse files Browse the repository at this point in the history 
Release v0.51.0 --> master
  • Loading branch information
@crmorford
crmorford committed Apr 3, 2015
2 parents ede5fae + dc87a7e commit af9a1d4
Show file tree
Hide file tree
Showing 25 changed files with 210 additions and 353 deletions.
2 changes: 1 addition & 1 deletion bower.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "plottable",
"description": "A library for creating charts out of D3",
"version": "0.50.0",
"version": "0.51.0",
"main": ["plottable.js", "plottable.css"],
"license": "MIT",
"ignore": [
Expand Down
2 changes: 1 addition & 1 deletion package.json
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "plottable.js",
"description": "A library for creating charts out of D3",
"version": "0.50.0",
"version": "0.51.0",
"repository": {
"type": "git",
"url": "https://github.com/palantir/plottable.git"
Expand Down
45 changes: 17 additions & 28 deletions plottable.d.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -412,30 +412,18 @@ declare module Plottable {

declare module Plottable {
/**
* A SymbolGenerator is a function that takes in a datum and the index of the datum to
* produce an svg path string analogous to the datum/index pair.
*
* Note that SymbolGenerators used in Plottable will be assumed to work within a 100x100 square
* to be scaled appropriately for use within Plottable
* A SymbolFactory is a function that takes in a symbolSize which is the edge length of the render area
* and returns a string representing the 'd' attribute of the resultant 'path' element
*/
type SymbolGenerator = (datum: any, index: number) => string;
module SymbolGenerators {
/**
* The radius that symbol generators will be assumed to have for their symbols.
*/
var SYMBOL_GENERATOR_RADIUS: number;
type StringAccessor = ((datum: any, index: number) => string);
/**
* A wrapper for D3's symbol generator as documented here:
* https://github.com/mbostock/d3/wiki/SVG-Shapes#symbol
*
* Note that since D3 symbols compute the path strings by knowing how much area it can take up instead of
* knowing its dimensions, the total area expected may be off by some constant factor.
*
* @param {string | ((datum: any, index: number) => string)} symbolType Accessor for the d3 symbol type
* @returns {SymbolGenerator} the symbol generator for a D3 symbol
*/
function d3Symbol(symbolType: string | StringAccessor): D3.Svg.Symbol;
type SymbolFactory = (symbolSize: number) => string;
module SymbolFactories {
type StringAccessor = (datum: any, index: number) => string;
function circle(): SymbolFactory;
function square(): SymbolFactory;
function cross(): SymbolFactory;
function diamond(): SymbolFactory;
function triangleUp(): SymbolFactory;
function triangleDown(): SymbolFactory;
}
}

Expand Down Expand Up @@ -2420,18 +2408,19 @@ declare module Plottable {
getEntry(position: Point): D3.Selection;
_doRender(): void;
/**
* Gets the SymbolGenerator of the legend, which dictates how
* Gets the symbolFactoryAccessor of the legend, which dictates how
* the symbol in each entry is drawn.
*
* @returns {SymbolGenerator} The SymbolGenerator of the legend
* @returns {(datum: any, index: number) => symbolFactory} The symbolFactory accessor of the legend
*/
symbolGenerator(): SymbolGenerator;
symbolFactoryAccessor(): (datum: any, index: number) => SymbolFactory;
/**
* Sets the SymbolGenerator of the legend
* Sets the symbolFactoryAccessor of the legend
*
* @param {(datum: any, index: number) => symbolFactory} The symbolFactory accessor to set to
* @returns {Legend} The calling Legend
*/
symbolGenerator(symbolGenerator: SymbolGenerator): Legend;
symbolFactoryAccessor(symbolFactoryAccessor: (datum: any, index: number) => SymbolFactory): Legend;
}
}
}
Expand Down
127 changes: 42 additions & 85 deletions plottable.js
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
/*!
Plottable 0.50.0 (https://github.com/palantir/plottable)
Plottable 0.51.0 (https://github.com/palantir/plottable)
Copyright 2014 Palantir Technologies
Licensed under MIT (https://github.com/palantir/plottable/blob/master/LICENSE)
*/
Expand Down Expand Up @@ -987,61 +987,33 @@ var Plottable;
///<reference path="../reference.ts" />
var Plottable;
(function (Plottable) {
var SymbolGenerators;
(function (SymbolGenerators) {
/**
* The radius that symbol generators will be assumed to have for their symbols.
*/
SymbolGenerators.SYMBOL_GENERATOR_RADIUS = 50;
/**
* A wrapper for D3's symbol generator as documented here:
* https://github.com/mbostock/d3/wiki/SVG-Shapes#symbol
*
* Note that since D3 symbols compute the path strings by knowing how much area it can take up instead of
* knowing its dimensions, the total area expected may be off by some constant factor.
*
* @param {string | ((datum: any, index: number) => string)} symbolType Accessor for the d3 symbol type
* @returns {SymbolGenerator} the symbol generator for a D3 symbol
*/
function d3Symbol(symbolType) {
// Since D3 symbols use a size concept, we have to convert our radius value to the corresponding area value
// This is done by inspecting the symbol size calculation in d3.js and solving how sizes are calculated from a given radius
var typeToSize = function (symbolTypeString) {
var sizeFactor;
switch (symbolTypeString) {
case "circle":
sizeFactor = Math.PI;
break;
case "square":
sizeFactor = 4;
break;
case "cross":
sizeFactor = 20 / 9;
break;
case "diamond":
sizeFactor = 2 * Math.tan(Math.PI / 6);
break;
case "triangle-up":
case "triangle-down":
sizeFactor = Math.sqrt(3);
break;
default:
sizeFactor = 1;
break;
}
return sizeFactor * Math.pow(SymbolGenerators.SYMBOL_GENERATOR_RADIUS, 2);
};
function ensureSymbolType(symTypeString) {
if (d3.svg.symbolTypes.indexOf(symTypeString) === -1) {
throw new Error(symTypeString + " is an invalid D3 symbol type. d3.svg.symbolTypes can retrieve the valid symbol types.");
}
return symTypeString;
}
var symbolSize = typeof (symbolType) === "string" ? typeToSize(ensureSymbolType(symbolType)) : function (datum, index) { return typeToSize(ensureSymbolType(symbolType(datum, index))); };
return d3.svg.symbol().type(symbolType).size(symbolSize);
var SymbolFactories;
(function (SymbolFactories) {
function circle() {
return function (symbolSize) { return d3.svg.symbol().type("circle").size(Math.PI * Math.pow(symbolSize / 2, 2))(); };
}
SymbolFactories.circle = circle;
function square() {
return function (symbolSize) { return d3.svg.symbol().type("square").size(Math.pow(symbolSize, 2))(); };
}
SymbolFactories.square = square;
function cross() {
return function (symbolSize) { return d3.svg.symbol().type("cross").size((5 / 9) * Math.pow(symbolSize, 2))(); };
}
SymbolFactories.cross = cross;
function diamond() {
return function (symbolSize) { return d3.svg.symbol().type("diamond").size(Math.tan(Math.PI / 6) * Math.pow(symbolSize, 2) / 2)(); };
}
SymbolFactories.diamond = diamond;
function triangleUp() {
return function (symbolSize) { return d3.svg.symbol().type("triangle-up").size(Math.sqrt(3) * Math.pow(symbolSize / 2, 2))(); };
}
SymbolGenerators.d3Symbol = d3Symbol;
})(SymbolGenerators = Plottable.SymbolGenerators || (Plottable.SymbolGenerators = {}));
SymbolFactories.triangleUp = triangleUp;
function triangleDown() {
return function (symbolSize) { return d3.svg.symbol().type("triangle-down").size(Math.sqrt(3) * Math.pow(symbolSize / 2, 2))(); };
}
SymbolFactories.triangleDown = triangleDown;
})(SymbolFactories = Plottable.SymbolFactories || (Plottable.SymbolFactories = {}));
})(Plottable || (Plottable = {}));

///<reference path="../reference.ts" />
Expand Down Expand Up @@ -1122,7 +1094,7 @@ var Plottable;
///<reference path="../reference.ts" />
var Plottable;
(function (Plottable) {
Plottable.version = "0.50.0";
Plottable.version = "0.51.0";
})(Plottable || (Plottable = {}));

///<reference path="../reference.ts" />
Expand Down Expand Up @@ -3370,12 +3342,12 @@ var Plottable;
var yProjector = attrToProjector["y"];
delete attrToProjector["x"];
delete attrToProjector["y"];
var rProjector = attrToProjector["r"];
delete attrToProjector["r"];
attrToProjector["transform"] = function (datum, index) { return "translate(" + xProjector(datum, index) + "," + yProjector(datum, index) + ") " + "scale(" + rProjector(datum, index) / 50 + ")"; };
var rProjector = attrToProjector["size"];
delete attrToProjector["size"];
attrToProjector["transform"] = function (datum, index) { return "translate(" + xProjector(datum, index) + "," + yProjector(datum, index) + ")"; };
var symbolProjector = attrToProjector["symbol"];
delete attrToProjector["symbol"];
attrToProjector["d"] = symbolProjector;
attrToProjector["d"] = attrToProjector["d"] || (function (datum, index) { return symbolProjector(datum, index)(rProjector(datum, index)); });
_super.prototype._drawStep.call(this, step);
};
Symbol.prototype._getPixelPoint = function (datum, index) {
Expand Down Expand Up @@ -5531,7 +5503,7 @@ var Plottable;
this._fixedWidthFlag = true;
this._fixedHeightFlag = true;
this._sortFn = function (a, b) { return _this._scale.domain().indexOf(a) - _this._scale.domain().indexOf(b); };
this._symbolGenerator = Plottable.SymbolGenerators.d3Symbol("circle");
this._symbolFactoryAccessor = function () { return Plottable.SymbolFactories.circle(); };
}
Legend.prototype._setup = function () {
_super.prototype._setup.call(this);
Expand Down Expand Up @@ -5695,7 +5667,7 @@ var Plottable;
return translateString;
});
});
entries.select("path").attr("d", this.symbolGenerator()).attr("transform", "translate(" + (layout.textHeight / 2) + "," + layout.textHeight / 2 + ") " + "scale(" + (layout.textHeight * 0.3 / Plottable.SymbolGenerators.SYMBOL_GENERATOR_RADIUS) + ")").attr("fill", function (value) { return _this._scale.scale(value); }).attr("vector-effect", "non-scaling-stroke").classed(Legend.LEGEND_SYMBOL_CLASS, true);
entries.select("path").attr("d", function (d, i) { return _this.symbolFactoryAccessor()(d, i)(layout.textHeight * 0.6); }).attr("transform", "translate(" + (layout.textHeight / 2) + "," + layout.textHeight / 2 + ")").attr("fill", function (value) { return _this._scale.scale(value); }).classed(Legend.LEGEND_SYMBOL_CLASS, true);
var padding = this._padding;
var textContainers = entries.select("g.text-container");
textContainers.text(""); // clear out previous results
Expand All @@ -5713,12 +5685,12 @@ var Plottable;
self._writer.write(value, maxTextLength, self.height(), writeOptions);
});
};
Legend.prototype.symbolGenerator = function (symbolGenerator) {
if (symbolGenerator == null) {
return this._symbolGenerator;
Legend.prototype.symbolFactoryAccessor = function (symbolFactoryAccessor) {
if (symbolFactoryAccessor == null) {
return this._symbolFactoryAccessor;
}
else {
this._symbolGenerator = symbolGenerator;
this._symbolFactoryAccessor = symbolFactoryAccessor;
this._render();
return this;
}
Expand Down Expand Up @@ -7257,32 +7229,17 @@ var Plottable;
};
Scatter.prototype._generateAttrToProjector = function () {
var attrToProjector = _super.prototype._generateAttrToProjector.call(this);
attrToProjector["r"] = attrToProjector["r"] || d3.functor(3);
attrToProjector["size"] = attrToProjector["size"] || d3.functor(6);
attrToProjector["opacity"] = attrToProjector["opacity"] || d3.functor(0.6);
attrToProjector["fill"] = attrToProjector["fill"] || d3.functor(this._defaultFillColor);
attrToProjector["symbol"] = attrToProjector["symbol"] || Plottable.SymbolGenerators.d3Symbol("circle");
attrToProjector["vector-effect"] = attrToProjector["vector-effect"] || d3.functor("non-scaling-stroke");
// HACKHACK vector-effect non-scaling-stroke has no effect in IE
// https://connect.microsoft.com/IE/feedback/details/788819/svg-non-scaling-stroke
if (Plottable._Util.Methods.isIE() && attrToProjector["stroke-width"] != null) {
var strokeWidthProjector = attrToProjector["stroke-width"];
attrToProjector["stroke-width"] = function (d, i, u, m) {
var strokeWidth = strokeWidthProjector(d, i, u, m);
if (attrToProjector["vector-effect"](d, i, u, m) === "non-scaling-stroke") {
return strokeWidth * Plottable.SymbolGenerators.SYMBOL_GENERATOR_RADIUS / attrToProjector["r"](d, i, u, m);
}
else {
return strokeWidth;
}
};
}
attrToProjector["symbol"] = attrToProjector["symbol"] || (function () { return Plottable.SymbolFactories.circle(); });
return attrToProjector;
};
Scatter.prototype._generateDrawSteps = function () {
var drawSteps = [];
if (this._dataChanged && this._animate) {
var resetAttrToProjector = this._generateAttrToProjector();
resetAttrToProjector["r"] = function () { return 0; };
resetAttrToProjector["size"] = function () { return 0; };
drawSteps.push({ attrToProjector: resetAttrToProjector, animator: this._getAnimator("symbols-reset") });
}
drawSteps.push({ attrToProjector: this._generateAttrToProjector(), animator: this._getAnimator("symbols") });
Expand Down Expand Up @@ -7310,7 +7267,7 @@ var Plottable;
var drawer = _this._key2PlotDatasetKey.get(key).drawer;
drawer._getRenderArea().selectAll("path").each(function (d, i) {
var distSq = getDistSq(d, i, dataset.metadata(), plotMetadata);
var r = attrToProjector["r"](d, i, dataset.metadata(), plotMetadata);
var r = attrToProjector["size"](d, i, dataset.metadata(), plotMetadata) / 2;
if (distSq < r * r) {
if (!overAPoint || distSq < minDistSq) {
closestElement = this;
Expand Down
12 changes: 6 additions & 6 deletions plottable.min.js
View file

Large diffs are not rendered by default.

Binary file modified plottable.zip
View file
Binary file not shown.
17 changes: 7 additions & 10 deletions quicktests/overlaying/tests/animations/animate_scatter.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,6 @@ function makeData() {
function run(svg, data, Plottable) {
"use strict";

var doAnimate = true;
var circleRenderer;
var xScale = new Plottable.Scale.Linear();
var xAxis = new Plottable.Axis.Numeric(xScale, "bottom");

Expand All @@ -18,14 +16,13 @@ function run(svg, data, Plottable) {
var d1 = new Plottable.Dataset(data[0]);
var d2 = new Plottable.Dataset(data[1]);

circleRenderer = new Plottable.Plot.Scatter(xScale, yScale)
.addDataset(d1)
.addDataset(d2)
.attr("r", 8)
.project("x", "x", xScale)
.project("y", "y", yScale)
.attr("opacity", 0.75)
.animate(doAnimate);
var circleRenderer = new Plottable.Plot.Scatter(xScale, yScale).addDataset(d1)
.addDataset(d2)
.attr("size", 16)
.project("x", "x", xScale)
.project("y", "y", yScale)
.attr("opacity", 0.75)
.animate(true);

var circleChart = new Plottable.Component.Table([[yAxis, circleRenderer],
[null, xAxis]]);
Expand Down
23 changes: 9 additions & 14 deletions quicktests/overlaying/tests/animations/project_scatter.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,6 @@ function makeData() {

function run(svg, data, Plottable) {
"use strict";



//data

var dataseries1 = new Plottable.Dataset(data[0]);
Expand All @@ -19,16 +16,15 @@ function run(svg, data, Plottable) {
var xAxis = new Plottable.Axis.Numeric(xScale, "bottom");
var yAxis = new Plottable.Axis.Numeric(yScale, "left");


var widthProjector = function(d, i, m) {
return 25-(d.y*7);
return (25 - (d.y * 7)) * 2;
};

var colorProjector = function(d, i, m) {
var x = 22;
x += Math.floor(d.y*30);
x += Math.floor(d.y * 30);
var y = 10;
y += Math.floor(d.x*40);
y += Math.floor(d.x * 40);
return ("#11" + x + y);
};

Expand All @@ -38,17 +34,16 @@ function run(svg, data, Plottable) {

//rendering
var renderAreaD1 = new Plottable.Plot.Scatter(xScale, yScale).addDataset(dataseries1)
.attr("r", widthProjector)
.attr("fill", colorProjector)
.attr("opacity", opacityProjector)
.project("x", "x", xScale)
.project("y", "y", yScale)
.animate(true);
.attr("size", widthProjector)
.attr("fill", colorProjector)
.attr("opacity", opacityProjector)
.project("x", "x", xScale)
.project("y", "y", yScale)
.animate(true);

//title + legend
var title1 = new Plottable.Component.TitleLabel( "Opacity, r, color", "horizontal");


var basicTable = new Plottable.Component.Table().addComponent(0,2, title1)
.addComponent(1, 1, yAxis)
.addComponent(1, 2, renderAreaD1)
Expand Down
Loading

0 comments on commit af9a1d4

Please sign in to comment.