in src/chart.js [854:1045]
function displayYear(year) {
var progress = ((year + 1) - params.yearMin) / ((params.yearMax + 1) - params.yearMin);
if (globals.outer_progress_circle != undefined) {
d3.select('#outer_progress_value').attr('d', globals.outer_progress_circle.endAngle((Math.PI * 2) * (loop_count + progress)));
}
current_year = year;
circle_marks.data(interpolateData(year), function(d){
return d[params.key];
})
.call(position)
.sort(order);
// voronoi_cells.data(function(){
// var arr = interpolateData(year);
// var tmp = voronoi.polygons(arr);
// for (var i = 0; i < tmp.length; i++) {
// if (tmp[i] == undefined){
// tmp[i] = [[0,0],[0,0],[0,0],[0,0]];
// tmp[i].data = arr[i];
// }
// }
// return tmp;
// })
// .call(redrawPolygon);
/**
*
* BUBBLESET + ANNOTATIONS
*
**/
if (!non_interactive) {
var active_caption = false;
annotationList.forEach(function(d,i){
if (d.x == params.x && d.y == params.y && current_year >= d.yearStart && current_year <= d.yearEnd) {
if (d.caption != caption_text) {
caption_text = d.caption;
annotation_points = d.annotation_points;
annotation_points.forEach(function(b){
if (bubbleset_points.indexOf(b) == -1) {
bubbleset_points.push(b);
d3.select('#carousel_item_' + b).select('rect')
.style('stroke','gold');
}
});
}
active_caption = true;
}
if (i == annotationList.length - 1 && !active_caption) {
caption_text = '';
annotation_points.forEach(function(b){
bubbleset_points.splice(bubbleset_points.indexOf(b),1);
d3.select('#carousel_item_' + b).select('rect')
.style('stroke','#fff');
});
annotation_points = [];
active_caption = false;
}
});
if (caption_text != "") {
d3.select('#annotation_div').select('.annotation')
.html(caption_text);
d3.select('#annotation_div').style('display',null);
d3.selectAll('.carousel_item').style('display','none');
d3.selectAll('.carousel_clutch').style('display','none');
}
else {
d3.select('#annotation_div').style('display','none');
}
// console.log({
// 'bubbleset_points': bubbleset_points,
// 'outside_points': outside_points
// });
var bubbleset_update = bubbleset.transition()
// .delay(data.length * 10)
.ease(animation == 'on' ? d3.easeLinear : d3.easeElastic)
.duration(animation == 'on' ? 100 : (tilt == 'on' ? 0 : 500 + data.length * 10));
bubbleset_coords = [];
// outside_coords = [];
bubble_node = -1;
var bubble_x = 0,
bubble_y = 0,
bubble_r = 0,
k = 0;
for (var i = 0; i < bubbleset_points.length; i++) {
bubble_code = bubbleset_points[i];
k = 0;
bubble_node = -1;
while(k < data.length && bubble_node == -1) {
if(data[k].code == bubble_code) {
bubble_node = k;
}
k++;
}
bubble_x = scale_x(interpolateValues(data[bubble_node][params.x],current_year));
bubble_y = scale_y(interpolateValues(data[bubble_node][params.y],current_year));
bubble_r = scale_pop(Math.sqrt(interpolateValues(data[bubble_node][params.radius],current_year)));
bubbleset_coords.push({
x: bubble_x - bubble_r,
y: bubble_y - bubble_r,
width: 2 * bubble_r,
height: 2 * bubble_r,
});
}
// for (var j = 0; j < outside_points.length; j++) {
// bubble_code = outside_points[j];
// bubble_node = d3.select('#mark_' + bubble_code);
// outside_coords.push({
// x: bubble_node.select('circle').attr('cx') - bubble_node.select('circle').attr('r'),
// y: bubble_node.select('circle').attr('cy') - bubble_node.select('circle').attr('r'),
// width: 2 * bubble_node.select('circle').attr('r'),
// height: 2 * bubble_node.select('circle').attr('r'),
// });
// k = 0;
// bubble_node = -1;
// while(k < data.length && bubble_node == -1) {
// if(data[k].code == bubble_code) {
// bubble_node = k;
// }
// k++;
// }
// bubble_x = scale_x(interpolateValues(data[bubble_node][params.x],current_year));
// bubble_y = scale_y(interpolateValues(data[bubble_node][params.y],current_year));
// bubble_r = scale_pop(Math.sqrt(interpolateValues(data[bubble_node][params.radius],current_year)));
// outside_coords.push({
// x: bubble_x - bubble_r,
// y: bubble_y - bubble_r,
// width: 2 * bubble_r,
// height: 2 * bubble_r,
// });
// }
// console.log({
// 'bubbleset_coords': bubbleset_coords,
// 'outside_coords': outside_coords
// });
var bubbleset_list = bubbles.createOutline(
BubbleSet.addPadding(bubbleset_coords,bubbleset_pad),
BubbleSet.addPadding(outside_coords,bubbleset_pad),
null
);
var old_bubbleset_outline = bubbleset_outline.toString();
bubbleset_outline = new PointPath(bubbleset_list).transform([
new ShapeSimplifier(0.0),
new BSplineShapeGenerator(),
new ShapeSimplifier(0.0),
]);
bubbleset_outline = bubbleset_outline.toString();
var interpolator = flubber.interpolate(old_bubbleset_outline, bubbleset_outline);
bubbleset_update.style("visibility", (facets == 'off') ? 'visible' : 'hidden')
.attrTween('d', function(){ return interpolator; });
for (var h = 0; h < bubbleset_points.length; h++){
var node = document.getElementById('mark_' + bubbleset_points[h]);
node.parentElement.appendChild(node);
}
bubbleset.exit()
.remove();
}
d3.select('.year_indicator').text(facets == 'on' ? (params.yearMin + ' ― ' + params.yearMax) : Math.round(current_year));
}