localhots/shezmu
1
0
Fork 0
Code Releases Activity

Draw box plot x axis with a lighter color

Browse Source
This commit is contained in:
Gregory Eremin 2016-01-10 19:47:08 +03:00
parent a30dbf84f4
commit d9717e60c9
2 changed files with 5 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
dashboard/css/app.css
View File

@ -73,6 +73,9 @@ body {
.axis { .axis {
stroke: #888; stroke: #888;
} }
.axis.light {
stroke: #ddd;
}
.arrow { .arrow {
stroke: #888; stroke: #888;
fill: #888; fill: #888;

4
dashboard/js/app.jsx
View File

@ -221,15 +221,15 @@ var BoxPlot = React.createClass({
<div className="boxplot"> <div className="boxplot">
<svg> <svg>
<text key="title" x={-70} y={10} textAnchor="middle" transform="rotate(270)" className="axis-label">Speed</text> <text key="title" x={-70} y={10} textAnchor="middle" transform="rotate(270)" className="axis-label">Speed</text>
{this.props.points.map(renderBox)}
<line key="y-axis" x1={padLeft} x2={padLeft} y1={0} y2={maxHeight} className="axis" /> <line key="y-axis" x1={padLeft} x2={padLeft} y1={0} y2={maxHeight} className="axis" />
<path key="y-arrow" d="M30,0 32,7 28,7 Z" className="arrow" /> <path key="y-arrow" d="M30,0 32,7 28,7 Z" className="arrow" />
<text key="y-max" x={yMaxX} y={yMaxY} textAnchor="end"className="axis-label">{max.toFixed(1)}</text> <text key="y-max" x={yMaxX} y={yMaxY} textAnchor="end"className="axis-label">{max.toFixed(1)}</text>
<text key="y-zero" x={27} y={140} textAnchor="end" className="axis-label">0</text> <text key="y-zero" x={27} y={140} textAnchor="end" className="axis-label">0</text>
<line key="x-axis" x1={padLeft} x2={950} y1={maxHeight} y2={maxHeight} className="axis" /> <line key="x-axis" x1={padLeft} x2={950} y1={maxHeight} y2={maxHeight} className="axis light" />
<path key="x-arrow" d="M950,140 943,142 943,138 Z" className="arrow" /> <path key="x-arrow" d="M950,140 943,142 943,138 Z" className="arrow" />
<text key="x-label-now" x={940} y={chartHeight - padBottom} textAnchor="end" className="axis-label">now</text> <text key="x-label-now" x={940} y={chartHeight - padBottom} textAnchor="end" className="axis-label">now</text>
{xlabels} {xlabels}
{this.props.points.map(renderBox)}
</svg> </svg>
</div> </div>
); );