bendtherules/opencharts
1
0
Fork 0
mirror of https://github.com/bendtherules/opencharts.git synced 2026-08-18 22:02:37 +00:00
Code Issues Packages Projects Releases Wiki Activity

CssCharts aka OpenCharts

Browse Source 
Horizontal and vertical bar charts done
This commit is contained in:
bendtherules
2014-03-26 16:35:26 -07:00
commit 2477ca5489
9 changed files with 677 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
bar_ver/bar_ver.styl
+117
View File
@@ -0,0 +1,117 @@
full=100%
half=50%
*
-webkit-box-sizing border-box
-moz-box-sizing border-box
box-sizing border-box
.chart
width 50vw
height 50vh
margin 25vh 25vw
background-color lightgreen
position relative
.chart-container
width full
height full
axis-thick=1em
axis-line-thick=.25em
.axis
width full
height full
position absolute
z-index 4
.axis-x
.axis-y
position absolute
background-color lightgray
.axis-y
width axis-thick
height full
.axis-line
left half
.axis-line-container
margin 0 -0.5*axis-line-thick
height full
width axis-line-thick
.axis-x
height axis-thick
width full
bottom 0
.axis-line
top 50%
.axis-line-container
margin -0.5*axis-line-thick 0
height axis-line-thick
width full
.axis-line
width full
height full
position absolute
z-index 5
.axis-line-container
background-color black
.scene
position absolute
z-index 1
background-color green
width full
height full
padding-left axis-thick
padding-bottom axis-thick
.scene-container
width full
height full
background-color lightblue
count_bar=4
p_empty=50%
p_bar_m=p_empty/count_bar
p_bar_w=(full - p_empty)/count_bar
// p_bar=p_bar/count_bar
.bar
width p_bar_w
height full
margin 0 (p_bar_m/2)
// background-color lightgreen
float left
position relative
.bar-inner
position absolute
bottom 0
width full
background-color yellow
//automate this part
.part-1
.bar-inner
height 40%
.part-2
.bar-inner
height 65%
.part-3
.bar-inner
height 90%
.part-4
.bar-inner
height 75%
.clearfix
clear both