Skip to content

Commit

Permalink
no data message for pies
Browse files Browse the repository at this point in the history
  • Loading branch information
@pdgago
pdgago committed Apr 28, 2015
1 parent a487157 commit 9374d73
Show file tree
Hide file tree
Showing 8 changed files with 147 additions and 90 deletions.
76 changes: 48 additions & 28 deletions charicharts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -683,13 +683,22 @@ var p_no_data_message = PClass.extend({

var width = h_getLocale(this.opts.locale)['nodata'][0].length * 12;
var height = 60;
var translate;

var msg = this.$svg.append('g')
// Centered svg
.attr('transform', h_getTranslate(
if (this._$scope.pie) {
translate = h_getTranslate(
-(this.opts.fullWidth/2) + (this.opts.fullWidth) / 2,
-(this.opts.fullHeight/2) + (this.opts.fullHeight) / 2
);
} else {
translate = h_getTranslate(
-this.opts.margin.left + (this.opts.fullWidth) / 2,
-this.opts.margin.top + (this.opts.fullHeight) / 2
));
);
}

var msg = this.$svg.append('g')
.attr('transform', translate);

msg.append('rect')
.attr('x', -width / 2)
Expand Down Expand Up @@ -720,9 +729,16 @@ var p_no_data_message = PClass.extend({
_renderGrid: function() {
var ticks = 5;
var separation = this.opts.fullHeight / (ticks-1) - 1/ticks;
var translate;

if (this._$scope.pie) {
translate = h_getTranslate(-(this.opts.fullWidth/2), -(this.opts.fullHeight/2));
} else {
translate = h_getTranslate(-this.opts.margin.left, -this.opts.margin.top);
}

this.grid = this.$svg.append('g')
.attr('transform', h_getTranslate(-this.opts.margin.left, -this.opts.margin.top))
.attr('transform', translate)
.attr('class', 'bargrid');

for (var i = 1; i < ticks; i++) {
Expand Down Expand Up @@ -912,8 +928,7 @@ var p_pie_inner_arrow = PClass.extend({
}],

initialize: function() {
if (!this.pie) {return;}
if (!this.opts.innerArrow) {return;}
if (!this._$scope.dataAvailable || !this.opts.innerArrow) {return;}
var self = this;
this._drawArrow();

Expand Down Expand Up @@ -1028,35 +1043,35 @@ var p_pie = PClass.extend({
}],

initialize: function() {
this._dataAvailable = true;

var dataSum = d3.sum(this.data, function(d) {
return d.value >= 0 ? d.value : 0;
});

// If the sum is 0, call onNoData callback
// and stop rendering...
if (dataSum <= 0) {
this._dataAvailable = false;
this.opts.onNoData && this.opts.onNoData();
return;
}

// Pie layout
this.pie = d3.layout.pie()
.value(function(d) {
return d.value >= 0 ? d.value : 0;
})
.sort(null);
} else {
// Pie layout
this.pie = d3.layout.pie()
.value(function(d) {
return d.value >= 0 ? d.value : 0;
})
.sort(null);

// Pie arc
this.arc = d3.svg.arc()
.innerRadius(this.opts.radius * this.opts.innerRadius)
.outerRadius(this.opts.radius);
// Pie arc
this.arc = d3.svg.arc()
.innerRadius(this.opts.radius * this.opts.innerRadius)
.outerRadius(this.opts.radius);

// Paths
this.path = this.$svg.selectAll('path');
this.update();
// Paths
this.path = this.$svg.selectAll('path');
this.update();

// Set events
this._setEvents();
// Set events
this._setEvents();
}

return {
series: {
Expand All @@ -1065,7 +1080,8 @@ var p_pie = PClass.extend({
pie: {
path: this.path,
arc: this.arc
}
},
dataAvailable: this._dataAvailable
};
},

Expand Down Expand Up @@ -1125,6 +1141,7 @@ var p_pie = PClass.extend({
}

});

/**
* Scale Module
* ------------
Expand Down Expand Up @@ -2342,11 +2359,13 @@ Charicharts.PercentageBar = CClass.extend({
}

});

Charicharts.Pie = CClass.extend({

modules: [
p_svg,
p_pie,
p_no_data_message,
p_pie_inner_arrow
],

Expand Down Expand Up @@ -2376,6 +2395,7 @@ Charicharts.Pie = CClass.extend({
}

});

/* jshint ignore:start */
if (typeof define === 'function' && define.amd) {
define(Charicharts);
Expand Down
2 changes: 1 addition & 1 deletion charicharts.min.js
View file

Large diffs are not rendered by default.

76 changes: 48 additions & 28 deletions demo/charicharts.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -683,13 +683,22 @@ var p_no_data_message = PClass.extend({

var width = h_getLocale(this.opts.locale)['nodata'][0].length * 12;
var height = 60;
var translate;

var msg = this.$svg.append('g')
// Centered svg
.attr('transform', h_getTranslate(
if (this._$scope.pie) {
translate = h_getTranslate(
-(this.opts.fullWidth/2) + (this.opts.fullWidth) / 2,
-(this.opts.fullHeight/2) + (this.opts.fullHeight) / 2
);
} else {
translate = h_getTranslate(
-this.opts.margin.left + (this.opts.fullWidth) / 2,
-this.opts.margin.top + (this.opts.fullHeight) / 2
));
);
}

var msg = this.$svg.append('g')
.attr('transform', translate);

msg.append('rect')
.attr('x', -width / 2)
Expand Down Expand Up @@ -720,9 +729,16 @@ var p_no_data_message = PClass.extend({
_renderGrid: function() {
var ticks = 5;
var separation = this.opts.fullHeight / (ticks-1) - 1/ticks;
var translate;

if (this._$scope.pie) {
translate = h_getTranslate(-(this.opts.fullWidth/2), -(this.opts.fullHeight/2));
} else {
translate = h_getTranslate(-this.opts.margin.left, -this.opts.margin.top);
}

this.grid = this.$svg.append('g')
.attr('transform', h_getTranslate(-this.opts.margin.left, -this.opts.margin.top))
.attr('transform', translate)
.attr('class', 'bargrid');

for (var i = 1; i < ticks; i++) {
Expand Down Expand Up @@ -912,8 +928,7 @@ var p_pie_inner_arrow = PClass.extend({
}],

initialize: function() {
if (!this.pie) {return;}
if (!this.opts.innerArrow) {return;}
if (!this._$scope.dataAvailable || !this.opts.innerArrow) {return;}
var self = this;
this._drawArrow();

Expand Down Expand Up @@ -1028,35 +1043,35 @@ var p_pie = PClass.extend({
}],

initialize: function() {
this._dataAvailable = true;

var dataSum = d3.sum(this.data, function(d) {
return d.value >= 0 ? d.value : 0;
});

// If the sum is 0, call onNoData callback
// and stop rendering...
if (dataSum <= 0) {
this._dataAvailable = false;
this.opts.onNoData && this.opts.onNoData();
return;
}

// Pie layout
this.pie = d3.layout.pie()
.value(function(d) {
return d.value >= 0 ? d.value : 0;
})
.sort(null);
} else {
// Pie layout
this.pie = d3.layout.pie()
.value(function(d) {
return d.value >= 0 ? d.value : 0;
})
.sort(null);

// Pie arc
this.arc = d3.svg.arc()
.innerRadius(this.opts.radius * this.opts.innerRadius)
.outerRadius(this.opts.radius);
// Pie arc
this.arc = d3.svg.arc()
.innerRadius(this.opts.radius * this.opts.innerRadius)
.outerRadius(this.opts.radius);

// Paths
this.path = this.$svg.selectAll('path');
this.update();
// Paths
this.path = this.$svg.selectAll('path');
this.update();

// Set events
this._setEvents();
// Set events
this._setEvents();
}

return {
series: {
Expand All @@ -1065,7 +1080,8 @@ var p_pie = PClass.extend({
pie: {
path: this.path,
arc: this.arc
}
},
dataAvailable: this._dataAvailable
};
},

Expand Down Expand Up @@ -1125,6 +1141,7 @@ var p_pie = PClass.extend({
}

});

/**
* Scale Module
* ------------
Expand Down Expand Up @@ -2342,11 +2359,13 @@ Charicharts.PercentageBar = CClass.extend({
}

});

Charicharts.Pie = CClass.extend({

modules: [
p_svg,
p_pie,
p_no_data_message,
p_pie_inner_arrow
],

Expand Down Expand Up @@ -2376,6 +2395,7 @@ Charicharts.Pie = CClass.extend({
}

});

/* jshint ignore:start */
if (typeof define === 'function' && define.amd) {
define(Charicharts);
Expand Down
2 changes: 1 addition & 1 deletion src/constructors/percentage-bar.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,4 +36,4 @@ Charicharts.PercentageBar = CClass.extend({
return o;
}

});
});
3 changes: 2 additions & 1 deletion src/constructors/pie.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ Charicharts.Pie = CClass.extend({
modules: [
p_svg,
p_pie,
p_no_data_message,
p_pie_inner_arrow
],

Expand Down Expand Up @@ -31,4 +32,4 @@ Charicharts.Pie = CClass.extend({
return o;
}

});
});
26 changes: 21 additions & 5 deletions src/parts/no-data-message.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -18,13 +18,22 @@ var p_no_data_message = PClass.extend({

var width = h_getLocale(this.opts.locale)['nodata'][0].length * 12;
var height = 60;
var translate;

var msg = this.$svg.append('g')
// Centered svg
.attr('transform', h_getTranslate(
if (this._$scope.pie) {
translate = h_getTranslate(
-(this.opts.fullWidth/2) + (this.opts.fullWidth) / 2,
-(this.opts.fullHeight/2) + (this.opts.fullHeight) / 2
);
} else {
translate = h_getTranslate(
-this.opts.margin.left + (this.opts.fullWidth) / 2,
-this.opts.margin.top + (this.opts.fullHeight) / 2
));
);
}

var msg = this.$svg.append('g')
.attr('transform', translate);

msg.append('rect')
.attr('x', -width / 2)
Expand Down Expand Up @@ -55,9 +64,16 @@ var p_no_data_message = PClass.extend({
_renderGrid: function() {
var ticks = 5;
var separation = this.opts.fullHeight / (ticks-1) - 1/ticks;
var translate;

if (this._$scope.pie) {
translate = h_getTranslate(-(this.opts.fullWidth/2), -(this.opts.fullHeight/2));
} else {
translate = h_getTranslate(-this.opts.margin.left, -this.opts.margin.top);
}

this.grid = this.$svg.append('g')
.attr('transform', h_getTranslate(-this.opts.margin.left, -this.opts.margin.top))
.attr('transform', translate)
.attr('class', 'bargrid');

for (var i = 1; i < ticks; i++) {
Expand Down
3 changes: 1 addition & 2 deletions src/parts/pie-inner-arrow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,7 @@ var p_pie_inner_arrow = PClass.extend({
}],

initialize: function() {
if (!this.pie) {return;}
if (!this.opts.innerArrow) {return;}
if (!this._$scope.dataAvailable || !this.opts.innerArrow) {return;}
var self = this;
this._drawArrow();

Expand Down
Loading

0 comments on commit 9374d73

Please sign in to comment.