Box Chart & UI Dashboard changes

by Shankar

HTML

<!-- Box chart modal-body content -->

<div class="modal-body">
            <div style="height:20px"></div>
           <div class="wrapper" style="width:1310px">
            <div class="myDiv">
              <ul>
                <li><a style="background-color:#fff;color:#000;border:0px">Sun</a></li>
                <li><a style="background-color:#ff0000;">18%</a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a style="background-color:#ffe500;color:#000;border-color:#fff">54%</a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a style="background-color:#ffe500;color:#000;border-color:#fff">60%</a></li>
                <li><a style="background-color:#ff9d00;">40%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
                <li><a style="background-color:#ff0000;">20%</a></li>
              </ul>
            </div>

            <div class="myDiv">
              <ul>
                <li><a style="background-color:#fff;color:#000;border:0px">Mon</a></li>
                <li><a style="background-color:#ff0000;">19%</a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a></a></li>
                <li><a style="background-color:#ffe500;color:#000;border-color:#fff">50%</a></li>
                <li><a></a></li>
                <li><a></a></li>
               ...

CSS

/* 


•	Airport Delay – Adjacent peaks – WIP 
•	Bar graph in the behind – Border is still visible 
•	SA- the bigger circle of 86 % is thinner and the white portion should not be there ideally (Target is 100 % than the whole circle else the whole circle would not be there)
•	Target is not specified on the SA circle- configuration 
•	Text in the release notes 
•	The notional circle of SA needs to laterally reversed 
•	The left and right arrows are not matching (one is enabled ,other is disabled
•	Bubble on Slot utilisation should be in background
•	Static text in Slot utilisation 
•	Speed of scroll text –check feasibility to make it slower 
•	Bar graph line are visible minutely 
•	Round figure for the y1 and y2 axis- rounding events at Airport delay second level 
•	Fixed header for Airport delay level 2 , icons of print , data and time icon 
•	Line graphs should go in the background as compare to lollypop 
•	Reduced the thickness of line graphs 
•	The scaling lines should be dimmer and comparatively should take the back seat 
•	Time stamp would be horizontal and 00;00 hours not required 
•	Use K for more than 1000 records
•	Dotted lines for the inverse chart 
•	Single RWY legend – add that in the Airport delay 
•	X axis – 0 has to be removed 
•	Slot Adherence –reverse bubble needs to be fixed 
•	Greying of future data bubble 
•	Text adjacent to x axis 
•	Target line in yellow color 
•	Slot adherence – All direction ..s “s” is missing 
•	Verify the RGB values 
•	Change the text in the box chart in terms of concept 
•	Level 4 – Bubble chart – WIP needs to be aligned with wireframe
•	Bottom should have black border to show the numbers
•	Border of the circle should not be there
•	All directions – plural 





*/