+ let hlcolor = [color[0], color[1], color[2]];
+ if (scores[i] !== 0) {
+ hlcolor[0] = Math.min(hlcolor[0] * 1.4, 1.0);
+ hlcolor[1] = Math.min(hlcolor[1] * 1.4, 1.0);
+ hlcolor[2] = Math.min(hlcolor[2] * 1.4, 1.0);
+ }
+ rect.style.fill = 'rgb(' + color[0]*100.0 + '%, ' + color[1]*100.0 + '%, ' + color[2]*100.0 + '%)';
+
+ // score_history contains the Nth _position_, but format_tooltip
+ // wants to format the Nth _move_; thus the -1.
+ const tooltip = format_tooltip(data, i + first_move_num - 1);
+ rect.addEventListener('mouseenter', (e) => draw_hover(e, hlcolor, tooltip));
+ rect.addEventListener('mousemove', (e) => draw_hover(e, hlcolor, tooltip));
+ rect.addEventListener('mouseleave', (e) => hide_hover(e, color));
+ rect.addEventListener('click', (e) => show_line(0, i + first_move_num - 1));
+ scorespark.appendChild(rect);
+ }