localhots
/
empact
1
0
Fork 0
Code Releases Activity

Thin out labels

This commit is contained in:
Gregory Eremin 2015-03-17 01:23:40 +07:00
parent 4d3ddad9a2
commit e6b1eced20
1 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/scripts/src/charts/stacked_area_chart.jsx
View File

@ -394,12 +394,24 @@ var Axis = React.createClass({
return null; return null;
} }
var renderMark = function(week, i) { var renderMark = function(week, i) {
var x = i/(this.props.weeks.length - 1)*this.props.width, var len = this.props.weeks.length,
x = i/(len - 1)*this.props.width,
showLabel,
ta = (i === 0 ta = (i === 0
? 'start' ? 'start'
: (i === this.props.weeks.length - 1 : (i === len - 1
? 'end' ? 'end'
: 'middle')); : 'middle'));
// Thin out labels
if (len > 20) {
showLabel = (i % 2 === 0);
} else if (len > 10) {
showLabel = (i % 2 === 0);
} else {
showLabel = true;
}
return ( return (
<g key={'mark-'+ i}> <g key={'mark-'+ i}>
<line <line
@ -408,14 +420,14 @@ var Axis = React.createClass({
x2={x} x2={x}
y2={this.props.y + 4} y2={this.props.y + 4}
stroke="#666" strokeWidth="1" /> stroke="#666" strokeWidth="1" />
<text className="axis-mark" {showLabel ? <text className="axis-mark"
x={x} x={x}
y={this.props.y + 15} y={this.props.y + 15}
textAnchor={ta} textAnchor={ta}
fill="#666" fill="#666"
> >
{formatDate(week)} {formatDate(week)}
</text> </text> : null}
</g> </g>
); );
}.bind(this); }.bind(this);