Skip to content

Commit

Permalink
Fix annotations plugin
Browse files Browse the repository at this point in the history
  • Loading branch information
vladminsky committed May 25, 2016
1 parent 1dbb055 commit d2c1825
Show file tree
Hide file tree
Showing 9 changed files with 78 additions and 43 deletions.
7 changes: 7 additions & 0 deletions examples/dev-quick-test/ex-000.js
Expand Up @@ -5,6 +5,13 @@ window.samples.push({
type: 'line',
x: ['x'],
y: ['y'],
label: 'y',
guide: {
anchorSize: 1.5,
label: {
tickFormat: '.4r'
}
},

data: _.times(100, _.identity)
.reduce(function (memo, i) {
Expand Down
16 changes: 11 additions & 5 deletions examples/dev-quick-test/ex-016.js
@@ -1,10 +1,13 @@
window.samples.push({

"type": "bar",
z: 33,
"type": "horizontal-bar",
stack: true,
"color": null,
"size": null,
"x": ["x1", "x2"],
"y": ["y1"],
// "size": 'y1',
"label": 'y1',
"y": ["x1", "x2"],
"x": ["y1"],
"guide": [
{
"x": {
Expand All @@ -22,7 +25,9 @@ window.samples.push({
],
data: [

{"p":"A", "x1": "TP3 Project Highlight", "x2": "B0", "y1": 2231},
{"p":"A", "x1": "TP3 Project Highlight", "x2": "B0", "y1": -2231},
{"p":"A", "x1": "TP3 Project Highlight", "x2": "B0", "y1": -3231},

{"p":"A", "x1": "TP3 Project Highlight", "x2": "B1", "y1": 3231},
{"p":"A", "x1": "TP3 Project Highlight", "x2": "B2", "y1": 3231},
{"p":"A", "x1": "TP3 Project Highlight", "x2": "B3", "y1": 3231},
Expand All @@ -46,6 +51,7 @@ window.samples.push({
],

plugins: [
tauCharts.api.plugins.get('tooltip')(),
tauCharts.api.plugins.get('settings')()
]

Expand Down
4 changes: 2 additions & 2 deletions examples/dev-quick-test/ex-051.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

57 changes: 40 additions & 17 deletions plugins/annotations.js
Expand Up @@ -13,6 +13,7 @@

var _ = tauCharts.api._;
var d3 = tauCharts.api.d3;
var pluginsSDK = tauCharts.api.pluginsSDK;

var addToUnits = function (units, newUnit, position) {
if (position === 'front') {
Expand Down Expand Up @@ -158,7 +159,7 @@
namespace: 'annotations',
x: coordsUnit.x,
y: coordsUnit.y,
color: 'color:default',
color: noteItem.colorScaleName,
label: textScaleName,
expression: {
inherit: false,
Expand All @@ -182,9 +183,6 @@
guide: {
showAnchors: false,
cssClass: 'graphical-report__annotation-area',
color: {
fill: noteItem.color
},
label: {
fontColor: noteItem.color,
position: ['r', 'b']
Expand Down Expand Up @@ -220,7 +218,7 @@
x: coordsUnit.x,
y: coordsUnit.y,
label: textScaleName,
color: 'color:default',
color: noteItem.colorScaleName,
expression: {
inherit: false,
operator: 'none',
Expand All @@ -242,9 +240,6 @@
showAnchors: false,
widthCssClass: 'graphical-report__line-width-2',
cssClass: 'graphical-report__annotation-line',
color: {
fill: noteItem.color
},
label: {
fontColor: noteItem.color,
position: ['r', 'b']
Expand All @@ -265,18 +260,46 @@
}
});

units.forEach(function (coordsUnit) {
var specApi = pluginsSDK.spec(specRef);

settings.items.forEach(function (item) {
units.forEach(function (coordsUnit) {

item.color = item.color || '#BD10E0'; // #4300FF / #FFAB00
settings
.items
.map(function (item, i) {

if (_.isArray(item.val)) {
self.addAreaNote(specRef, coordsUnit, item);
} else {
self.addLineNote(specRef, coordsUnit, item);
}
});
var color = (item.color || '#BD10E0').toLowerCase();
var rgbCode = d3.rgb(color).toString().toUpperCase();
if ((color !== 'black') && (rgbCode === '#000000')) {
rgbCode = null;
}
var colorStr = rgbCode || color;

var colorScaleName = 'annotation_color_' + i;
specApi.addScale(
colorScaleName,
{
type: 'color',
source: '?',
brewer: [colorStr]
});

return {
dim: item.dim,
val: item.val,
text: item.text,
color: colorStr,
position: item.position,
colorScaleName: colorScaleName
};
})
.forEach(function (item) {
if (_.isArray(item.val)) {
self.addAreaNote(specRef, coordsUnit, item);
} else {
self.addLineNote(specRef, coordsUnit, item);
}
});
});
}
};
Expand Down
6 changes: 5 additions & 1 deletion plugins/trendline.js
Expand Up @@ -485,7 +485,11 @@
var item = {};
item[x] = xMapper(p[0]);
item[y] = yMapper(p[1]);
item[g] = k;

if (g) {
item[g] = k;
}

return item;
})
.value();
Expand Down
4 changes: 2 additions & 2 deletions src/elements/decorators/layer-labels.js
Expand Up @@ -54,14 +54,14 @@ export class LayerLabels {

var text = this
.container
.selectAll('.title')
.selectAll('.t-label')
.data(fullData);
text.exit()
.remove();
text.call(update);
text.enter()
.append('text')
.attr('class', 'title')
.attr('class', 't-label')
.call(update);

return text;
Expand Down
9 changes: 0 additions & 9 deletions src/elements/element.path.base.js
Expand Up @@ -30,8 +30,6 @@ export class BasePath extends Element {
this.config.guide.label,
{
fontSize: 11,
paddingX: 0,
paddingY: 0,
position: (this.config.flip ? ['r+', 'l-'] : ['t+', 'b-'])
});

Expand Down Expand Up @@ -202,13 +200,6 @@ export class BasePath extends Element {
{x: m[0], y: m[1]});
});

if (guide.color.fill && !model.scaleColor.dim) {
this.style({
fill: guide.color.fill,
stroke: guide.color.fill
});
}

if (guide.showAnchors) {

let attr = {
Expand Down
10 changes: 6 additions & 4 deletions test/element-line.test.js
Expand Up @@ -155,9 +155,10 @@ define(function (require) {
x: 'x',
y: 'y',
label: 'letter',
color: 0,
guide: {
color: {
fill: '#abcdef' // rgb(171, 205, 239)
brewer: ['#abcdef'] // rgb(171, 205, 239)
},
label: {
fontColor: '#fedcba'
Expand All @@ -180,11 +181,12 @@ define(function (require) {
it("should render line with text on each dot", function () {
var lines = d3.selectAll('.line');
expect(lines[0].length).to.be.equal(1);
expect(str(d3.rgb(lines.style('fill'))))
var path = lines.select('path');
expect(str(d3.rgb(path.attr('stroke'))))
.to
.be
.equal(str(d3.rgb('rgb(171, 205, 239)')));
var labels = d3.selectAll('.title');
.equal(str(d3.rgb('rgb(171, 205, 239)')), 'stroke');
var labels = d3.selectAll('.t-label');
expect(labels[0].length).to.be.equal(5);
expect(str(d3.rgb(labels.style('fill'))))
.to
Expand Down
8 changes: 5 additions & 3 deletions test/element-path.test.js
Expand Up @@ -162,9 +162,10 @@ define(function (require) {
x: 'x',
y: 'y',
label: 'letter',
color: 0,
guide: {
color: {
fill: '#abcdef' // rgb(171, 205, 239)
brewer: ['#abcdef'] // rgb(171, 205, 239)
},
label: {
fontColor: '#fedcba'
Expand All @@ -187,11 +188,12 @@ define(function (require) {
it("should render polygon with text on each angle", function () {
var area = d3.selectAll('.area');
expect(area[0].length).to.be.equal(1);
expect(str(d3.rgb(area.style('fill'))))
var polygon = area.select('polygon');
expect(str(d3.rgb(polygon.attr('fill'))))
.to
.be
.equal(str(d3.rgb('rgb(171, 205, 239)')));
var labels = d3.selectAll('.title');
var labels = d3.selectAll('.t-label');
expect(labels[0].length).to.be.equal(4);
expect(str(d3.rgb(labels.style('fill'))))
.to
Expand Down

0 comments on commit d2c1825

Please sign in to comment.