localhots
/
empact
1
0
Fork 0
Code Releases Activity

Fix label underlay positioning

This commit is contained in:
Gregory Eremin 2015-03-08 22:44:48 +07:00
parent 4ebcdb28c8
commit 2191a0c246
1 changed files with 13 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
app/scripts/charts.jsx
View File

@ -1,4 +1,5 @@
var Router = ReactRouter; var SVGNS = "http://www.w3.org/2000/svg",
Router = ReactRouter;
var BarChart = React.createClass({ var BarChart = React.createClass({
barHeight: 40, barHeight: 40,
@ -60,11 +61,12 @@ var Bar = React.createClass({
render: function() { render: function() {
var p = this.props.point var p = this.props.point
w = this.props.width*500, w = this.props.width*500,
label = p.item + ": " + p.commits, label = p.item + ': ' + p.commits,
lw = label.length*10 + 5, labelm = 10, // Margin
tx = 10; labelw = label.length*9 + 2*labelm, // Width
if (lw > w) { textx = labelm;
tx = w + tx; if (labelw + 2*labelm > w) {
textx = w + textx;
} }
return ( return (
<g onClick={this.handleClick}> <g onClick={this.handleClick}>
@ -72,8 +74,11 @@ var Bar = React.createClass({
width={this.props.width*500} width={this.props.width*500}
height={this.props.height} height={this.props.height}
x="0" y={this.props.y} rx="2" ry="2" /> x="0" y={this.props.y} rx="2" ry="2" />
<rect className="label_underlay" x={tx-6} y={this.props.y+10} height={20} width={lw} rx="3" ry="3" /> <rect className="label_underlay"
<text className="label" x={tx} y={this.props.y + 26}>{label}</text> x={textx-6} y={this.props.y+10}
height={20} width={labelw}
rx="3" ry="3" />
<text className="label" x={textx} y={this.props.y + 26}>{label}</text>
</g> </g>
); );
} }