fix advantage chart values floating point

This commit is contained in:
Thibault Duplessis 2013-05-30 00:50:10 +02:00
parent e34c731e76
commit 1cee253a69
3 changed files with 180 additions and 117 deletions

View file

@ -7,7 +7,7 @@ import play.api.templates.Html
trait AssetHelper {
val assetVersion = 5
val assetVersion = 6
def cssTag(name: String) = css("stylesheets/" + name)

View file

@ -22,7 +22,7 @@ private[analyse] final class AdvantageChart(advices: InfoAdvices) {
advices sliding 2 collect {
case (info, advice) :: (next, _) :: Nil
(next.score, next.mate) match {
case (Some(score), _) Json.arr(move(info, advice), scale(score.pawns))
case (Some(score), _) Json.arr(move(info, advice), scale(score.pawns).toString)
case (_, Some(mate)) Json.arr(move(info, advice), {
val mateDelta = math.abs(mate.toFloat / 100)
val whiteWins = info.color.fold(mate < 0, mate > 0)
@ -31,5 +31,5 @@ private[analyse] final class AdvantageChart(advices: InfoAdvices) {
case _ Json.arr(move(info, none), scale(0))
}
} toList
}
}
}

View file

@ -1,130 +1,193 @@
function drawCharts() {
var light = $('body').hasClass('light');
var bg = "transparent";
var textcolor = {color: light ? '#848484' : '#a0a0a0'};
var bg = "transparent";
var textcolor = {
color: light ? '#848484' : '#a0a0a0'
};
var weak = light ? '#ccc' : '#404040';
var strong = light ? '#a0a0a0' : '#606060';
var lineColor = {color: weak};
var lineColor = {
color: weak
};
function elemToData(elem) {
var data = new google.visualization.DataTable();
$.each($(elem).data('columns'), function() {
data.addColumn(this[0], this[1]);
});
data.addRows($(elem).data('rows'));
data.addRows(_.map($(elem).data('rows'), function(e) {
return [e[0], parseFloat(e[1])];
}));
return data;
}
$('div.elo_history').each(function() {
var data = elemToData(this);
var chart = new google.visualization.ComboChart(this);
chart.draw(data, {
series: [{
color: "blue",
type: "area",
lineWidth: 2
}, {
color: "grey",
type: "line",
lineWidth: 1
}, {
color: "red",
type: "line",
lineWidth: 2
}
],
width: 500,
height: 340,
axisTitlePosition: 'none',
chartArea: {
left: "10%",
top: "2%",
width: "90%",
height: "96%"
},
titlePosition: 'none',
hAxis: {
textPosition: "none"
},
vAxis: {
textStyle: textcolor,
gridlines: lineColor,
baselineColor: weak
},
backgroundColor: bg
});
});
$('div.elo_distribution').each(function() {
var data = elemToData(this);
var chart = new google.visualization.ScatterChart(this);
chart.draw(data, {
width: 747,
height: 500,
//axisTitlePosition: 'none',
chartArea: {
left: "5%",
top: "3%",
width: "78%",
height: "92%"
},
title: $(this).attr('title'),
titlePosition: 'in',
pointSize: 3,
backgroundColor: bg
});
});
$('div.end_distribution').each(function() {
var data = elemToData(this);
var chart = new google.visualization.PieChart(this);
chart.draw(data, {
width: 747,
height: 500,
chartArea: {
left: "0%",
top: "5%",
width: "100%",
height: "95%"
},
is3D: true,
title: $(this).attr('title'),
backgroundColor: bg
});
});
$('div.move-time').each(function() {
var data = elemToData(this);
var chart = new google.visualization.AreaChart(this);
chart.draw(data, {
width: 747,
height: 400,
title: $(this).data('title'),
titleTextStyle: textcolor,
chartArea: {
left: "5%",
top: "5%",
width: "78%",
height: "90%"
},
backgroundColor: bg,
vAxis: {
textStyle: textcolor,
gridlines: lineColor
},
legend: {
textStyle: textcolor
}
});
});
$('div.move-times').each(function() {
var data = elemToData(this);
var chart = new google.visualization.PieChart(this);
chart.draw(data, {
width: 366,
height: 300,
title: $(this).data('title'),
legend: {
textStyle: textcolor
},
titleTextStyle: textcolor,
chartArea: {
left: "0%",
width: "100%",
height: "80%"
},
is3D: true,
backgroundColor: bg
});
});
$('div.adv_chart').each(function() {
var data = elemToData(this);
var chart = new google.visualization.AreaChart(this);
chart.draw(data, {
width: 512,
height: 150,
title: $(this).data('title'),
titleTextStyle: textcolor,
titlePosition: "in",
chartArea: {
left: "0%",
top: "0%",
width: "100%",
height: "100%"
},
backgroundColor: bg,
vAxis: {
maxValue: $(this).data('max'),
minValue: -$(this).data('max'),
baselineColor: strong,
gridlines: {
color: bg
},
minorGridlines: {
color: bg
},
viewWindowMode: "maximized"
},
legend: {
position: "none"
},
axisTitlesPosition: "none"
});
google.visualization.events.addListener(chart, 'select', function() {
var sel = chart.getSelection()[0];
GoToMove(sel.row + 1);
});
$(this).data("chart", chart);
});
}
$('div.elo_history').each(function() {
var data = elemToData(this);
var chart = new google.visualization.ComboChart(this);
chart.draw(data, {
series: [
{ color: "blue", type: "area", lineWidth: 2 },
{ color: "grey", type: "line", lineWidth: 1 },
{ color: "red", type: "line", lineWidth: 2 }
],
width: 500,
height: 340,
axisTitlePosition: 'none',
chartArea:{left:"10%",top:"2%",width:"90%",height:"96%"},
titlePosition: 'none',
hAxis: {textPosition: "none"},
vAxis: {textStyle: textcolor, gridlines: lineColor, baselineColor: weak},
backgroundColor: bg
});
$(function() {
$.getScript('https://www.google.com/jsapi?autoload={"modules":[{"name":"visualization","version":"1","packages":["corechart"],"callback":"drawCharts"}]}');
});
$('div.elo_distribution').each(function() {
var data = elemToData(this);
var chart = new google.visualization.ScatterChart(this);
chart.draw(data, {
width: 747,
height: 500,
//axisTitlePosition: 'none',
chartArea:{left:"5%",top:"3%",width:"78%",height:"92%"},
title: $(this).attr('title'),
titlePosition: 'in',
pointSize: 3,
backgroundColor: bg
});
});
$('div.end_distribution').each(function() {
var data = elemToData(this);
var chart = new google.visualization.PieChart(this);
chart.draw(data, {
width: 747,
height: 500,
chartArea:{left:"0%",top:"5%",width:"100%",height:"95%"},
is3D: true,
title: $(this).attr('title'),
backgroundColor: bg
});
});
$('div.move-time').each(function() {
var data = elemToData(this);
var chart = new google.visualization.AreaChart(this);
chart.draw(data, {
width: 747,
height: 400,
title: $(this).data('title'),
titleTextStyle: textcolor,
chartArea:{left:"5%",top:"5%",width:"78%",height:"90%"},
backgroundColor: bg,
vAxis: {textStyle: textcolor, gridlines: lineColor},
legend: {textStyle: textcolor}
});
});
$('div.move-times').each(function() {
var data = elemToData(this);
var chart = new google.visualization.PieChart(this);
chart.draw(data, {
width: 366,
height: 300,
title: $(this).data('title'),
legend: {textStyle: textcolor},
titleTextStyle: textcolor,
chartArea:{left:"0%",width:"100%",height:"80%"},
is3D: true,
backgroundColor: bg
});
});
$('div.adv_chart').each(function() {
var data = elemToData(this);
var chart = new google.visualization.AreaChart(this);
chart.draw(data, {
width: 512,
height: 150,
title: $(this).data('title'),
titleTextStyle: textcolor,
titlePosition: "in",
chartArea:{left:"0%",top:"0%",width:"100%",height:"100%"},
backgroundColor: bg,
vAxis: {
maxValue: $(this).data('max'),
minValue: -$(this).data('max'),
baselineColor: strong,
gridlines: {color: bg},
minorGridlines: {color: bg},
viewWindowMode: "maximized"
},
legend: {position: "none"},
axisTitlesPosition: "none"
});
google.visualization.events.addListener(chart, 'select', function() {
var sel = chart.getSelection()[0];
GoToMove(sel.row + 1);
});
$(this).data("chart", chart);
});
}
$(function() {
$.getScript('https://www.google.com/jsapi?autoload={"modules":[{"name":"visualization","version":"1","packages":["corechart"],"callback":"drawCharts"}]}');
});