Permalink
Browse files

axes

  • Loading branch information...
1 parent d231352 commit f1c718d9af2f44ef2612e2958731a0bd4e32fea9 @tlevine committed Aug 18, 2013
Showing with 9 additions and 7 deletions.
  1. +4 −2 client/css/styles.css
  2. +2 −2 client/js/views/dashboard/page.js
  3. +3 −3 client/templates/dashboard/page.html
View
6 client/css/styles.css
@@ -31,11 +31,13 @@ a.download {
position: absolute;
left: 0;
font-size: 0.5em;
+ height: 0;
}
#barplot .tick .line {
+ vertical-align: top;
height: 1px;
- width: 80px;
- margin-right: 1em;
+ width: 120px;
+ margin-right: -40px;
display: inline-block;
background-color: rgba(0,0,0,0.3);
}
View
4 client/js/views/dashboard/page.js
@@ -41,11 +41,11 @@ function createMap(){
.attr("href", function(permitApplication) { return '#/applications/' + permitApplication.permitApplicationNumber })
.style("width", (100 / permitApplications.length) + '%')
.style("height", function(permitApplication) {
- var barHeight = Math.max(1, permitApplication.acreage / 10);
+ var barHeight = Math.max(3, permitApplication.acreage / 10);
return Math.round(barHeight) + "px";
})
.style("margin-top", function(permitApplication) {
- var barHeight = Math.max(1, permitApplication.acreage / 10);
+ var barHeight = Math.max(3, permitApplication.acreage / 10);
return (240 - Math.round(barHeight)) + "px";
});
View
6 client/templates/dashboard/page.html
@@ -3,9 +3,9 @@
<div id="map" style="height: 400px;"></div>
<p>Impacted acres by parish; grey means no impacted acres, and red means many impacted acres.</p>
<div id="barplot" style="height: 250px;">
- <div class="tick" style="bottom: 50px;"><div class="line"></div><span style="color: rgba(255,255,255,0);">0</span>500 acres</div>
- <div class="tick" style="bottom: 100px;"><div class="line"></div>1000 acres</div>
- <div class="tick" style="bottom: 200px;"><div class="line"></div>2000 acres</div>
+ <div class="tick" style="top: 200px;"><div class="line"></div><span style="color: rgba(255,255,255,0);">0</span>500 acres</div>
+ <div class="tick" style="top: 150px;"><div class="line"></div>1000 acres</div>
+ <div class="tick" style="top: 50px;"><div class="line"></div>2000 acres</div>
</div>
<p>Acreages of individual impact permits (Click on a bar for more information.)</p>

0 comments on commit f1c718d

Please sign in to comment.