glicko rating
by Tsuneo Yoshioka
HTML
<div id="glicko-rating">
</div>
JavaScript
function drawGlickoRatingChart(/*History[]*/histories, element){
function paizaRankToColor(rank){
return ['red', 'yellow', 'lightcyan', 'lightgreen', 'green', '#54bdc4', '#999'][rank - 1800];
}
function getRatingTooltipHtml(history){
const rating_updated_at = new Date(history.rating_updated_at);
return `レーティング: <b>${Math.floor(history.rating)}</b> ±${Math.floor(history.rd)}<br/>` +
`問題: <b>${history.problem.title} (${Math.floor(history.problem.rating)}±${Math.floor(history.problem.rd)})</b><br/>` +
`スコア: <b>${history.score}</b><br/>` +
`日時: <b>${rating_updated_at.toLocaleString()}</b><br/>`;
}
const dataTableRows = histories.map((history) => {
let fillColor;
if(history.score === 100){
fillColor = paizaRankToColor(history.problem.rank);
}else{
fillColor = 'gray';
}
return [
new Date(history.rating_updated_at),
750,
250,
250,
250,
250,
250,
250,
null, // history.rating,
getRatingTooltipHtml(history),
`point { size: 7; shape-type: circle; stroke-color: black; stroke-width: 1; fill-color: ${fillColor}; }`,
]
});
const ratingValues = histories.map((history) => history.rating);
const minRating = Math.min(Math.min(...ratingValues) - 100, 1250);
const maxRating = Math.max(Math.max(...ratingValues) + 100, 2250);
// const minRating = 1250;
// const maxRating = 2250;
const BAND_NUM = 7;
// arr.forEach((point, i) => {point.unshift(i); point.pop()});
// const chart = new google.visualization.LineChart(element);
const chart = new window.google.visualization.ComboChart(element);
let options = {
// title: 'paiza Rating History',
hAxis: {
title: 'Time',
viewWindow: {
min: (new Date('2000-01-01 00:00:00')),
max: (new Date('2020-01-01 00:00:00')), // 2250,
},
},
vAxis: {
title: 'paiza Rating',
viewWindow: {
min: minRating, // 750,
max:...