Andal.LND/edx-platform
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Rotated the profile graph labels, so the all fit

Browse Source 
--HG--
branch : bridger-dev
This commit is contained in:
Bridger Maxwell
2012-02-10 15:57:39 -05:00
parent 59ff6ce7df
commit 69343aaedd
2 changed files with 30 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
profile.html
View File

@@ -5,9 +5,9 @@
%>
<%block name="headextra">
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.min.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.stack.js"></script>
<script language="javascript" type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.symbol.js"></script>
<script type="text/javascript" src="${ settings.LIB_URL }flot/jquery.flot.symbol.js"></script>
<script>
<%include file="profile_graphs.js"/>
</script>

41
profile_graphs.js
View File

@@ -42,7 +42,7 @@ $(function () {
data: ${ json.dumps( [[i + tickIndex, score['percentage']] for i,score in enumerate(section['subscores'])] ) },
color: colors[${sectionIndex}].toString(),
});
ticks = ticks.concat( ${ json.dumps( [[i + tickIndex, str(i + 1)] for i,score in enumerate(section['subscores'])] ) } );
ticks = ticks.concat( ${ json.dumps( [[i + tickIndex, score['label'] ] for i,score in enumerate(section['subscores'])] ) } );
bottomTicks.push( [ ${tickIndex + len(section['subscores'])/2}, "${section['category']}" ] );
detail_tooltips["${section['category']}"] = ${ json.dumps([score['summary'] for score in section['subscores']] ) };
@@ -57,8 +57,8 @@ $(function () {
data: [[${tickIndex}, ${section['totalscore']['score']}]],
color: colors[${sectionIndex}].toString(),
});
ticks = ticks.concat( [ [${tickIndex}, "Total"] ] );
detail_tooltips["${section['category']} Total"] = [ "${section['totalscore']['summary']}" ];
ticks = ticks.concat( [ [${tickIndex}, "${section['totallabel']}"] ] );
detail_tooltips["${section['category']} Average"] = [ "${section['totalscore']['summary']}" ];
<% tickIndex += 1 + sectionSpacer %>
%else: ##This is for sections like midterm or final, which have no smaller components
@@ -66,12 +66,8 @@ $(function () {
data: [[${tickIndex}, ${section['totalscore']['score']}]],
color: colors[${sectionIndex}].toString(),
});
%if section['category'] == "Midterm":
bottomTicks = bottomTicks.concat( [ [${tickIndex}, "${section['category']}"] ] );
%else:
ticks = ticks.concat( [ [${tickIndex}, "${section['category']}"] ] );
%endif
ticks = ticks.concat( [ [${tickIndex}," ${section['totallabel']}"] ] );
detail_tooltips["${section['category']}"] = [ "${section['totalscore']['summary']}" ];
<% tickIndex += 1 + sectionSpacer %>
@@ -80,7 +76,7 @@ $(function () {
%endfor
//Alwasy be sure that one series has the xaxis set to 2, or the second xaxis labels won't show up
series.push( {label: 'Dropped Scores', data: droppedScores, points: {symbol: "cross", show: true, radius: 3}, bars: {show: false}, color: "red", xaxis: 2} );
series.push( {label: 'Dropped Scores', data: droppedScores, points: {symbol: "cross", show: true, radius: 3}, bars: {show: false}, color: "red"} );
/* ----------------------------- Grade overviewew bar -------------------------*/
@@ -93,7 +89,7 @@ $(function () {
%for section in grade_summary:
<%
weighted_score = section['totalscore']['score'] * section['weight']
summary_text = "{0} - {1:.0%} of a possible {2:.0%}".format(section['category'], weighted_score, section['weight'])
summary_text = "{0} - {1:.1%} of a possible {2:.0%}".format(section['category'], weighted_score, section['weight'])
%>
%if section['totalscore']['score'] > 0:
series.push({label: "${section['category']} - Weighted",
@@ -109,6 +105,8 @@ $(function () {
totalScore += section['totalscore']['score'] * section['weight']
%>
%endfor
ticks = ticks.concat( [ [${overviewBarX}, "Totals"] ] );
<% tickIndex += 1 + sectionSpacer %>
@@ -116,8 +114,7 @@ $(function () {
series: {stack: true,
lines: {show: false, steps: false },
bars: {show: true, barWidth: 0.6, align: 'center', lineWidth: 1},},
xaxis: {tickLength: 0, min: 0.0, max: ${tickIndex - sectionSpacer}},
xaxes: [{ticks: ticks}, {ticks: bottomTicks}],
xaxis: {tickLength: 0, min: 0.0, max: ${tickIndex - sectionSpacer}, ticks: ticks, labelAngle: 90},
yaxis: {ticks: [[1, "100%"], [0.87, "A 87%"], [0.7, "B 70%"], [0.6, "C 60%"], [0, "0%"]], min: 0.0, max: 1.0, labelWidth: 50},
grid: { hoverable: true, clickable: true, borderWidth: 1,
markings: [ {yaxis: {from: 0.87, to: 1 }, color: "#EBFFD5"}, {yaxis: {from: 0.7, to: 0.87 }, color: "#E6FFFF"},
@@ -131,6 +128,24 @@ $(function () {
var o = plot.pointOffset({x: ${overviewBarX} , y: ${totalScore}});
$grade_detail_graph.append('<div style="position:absolute;left:' + (o.left - 12) + 'px;top:' + (o.top - 20) + 'px">${"{:.0%}".format(totalScore)}</div>');
// //Rotate the x-axis labels
// var rotateValue = "rotate(-60deg)";
// var rotateOrigin = "bottom left";
// $("#grade-detail-graph .x1Axis .tickLabel").css( {
// '-webkit-transform': rotateValue,
// '-moz-transform': rotateValue,
// '-ms-transform': rotateValue,
// '-o-transform': rotateValue,
// 'transform': rotateValue,
//
// '-webkit-transform-origin': rotateOrigin,
// '-moz-transform-origin': rotateOrigin,
// '-ms-transform-origin': rotateOrigin,
// '-o-transform-origin': rotateOrigin,
//
// 'text-align' : 'left',
// });
}