src/zoomable-circles.js
function(d) {

            var self = this;

            $('#circle-info').html(d.name);
            console.log(d);

            var focus0 = self.focus; 
            self.focus = d;

            var transition = d3.transition()
                .duration(d3.event.altKey ? 7500 : 750)
                .tween("zoom", function(d) {
                    var i = d3.interpolateZoom(self.view, 
                             [self.focus.x, self.focus.y, 
                              self.focus.r * 2 + self.options.margin]);
                    return function(t) {
                        self.zoomTo(i(t));
                    };
                });

            transition.selectAll("text")
                .filter(function(d) {
                    return d.parent === self.focus ||
                           this.style.display === "inline" ||
                           d.parent === focus0;
                })
                .style("fill-opacity", function(d) {
                    return d.parent === self.focus ? 1 : 0.5;
                })
                .each("start", function(d) {
                    if (d.parent === self.focus) 
                        this.style.display = "inline";
                })
                .each("end", function(d) {
                    if (d.parent !== self.focus) 
                        this.style.display = "none";
                });

            // logos are opaque at root level only
            transition.selectAll("use")
                .style("opacity", function(d) {
                    return self.focus.depth === 0 ? 1 : 0.8;
                });
        }
function(d) {

            var self = this;

            $('#circle-info').html(d.name);
            console.log(d);

            var focus0 = self.focus; 
            self.focus = d;

            var transition = d3.transition()
                .duration(d3.event.altKey ? 7500 : 750)
                .tween("zoom", function(d) {
                    var i = d3.interpolateZoom(self.view, 
                             [self.focus.x, self.focus.y, 
                              self.focus.r * 2 + self.options.margin]);
                    return function(t) {
                        self.zoomTo(i(t));
                    };
                });

            transition.selectAll("text")
                .filter(function(d) {
                    return d.parent === self.focus ||
                           this.style.display === "inline" ||
                           d.parent === focus0;
                })
                .style("fill-opacity", function(d) {
                    return d.parent === self.focus ? 1 : 0.5;
                })
                .each("start", function(d) {
                    if (d.parent === self.focus) 
                        this.style.display = "inline";
                })
                .each("end", function(d) {
                    if (d.parent !== self.focus) 
                        this.style.display = "none";
                });

            // logos are opaque at root level only
            transition.selectAll("use")
                .style("opacity", function(d) {
                    return self.focus.depth === 0 ? 1 : 0.8;
                });
        }
function ( d ) { var self = this ; $ ( '#circle-info' ) . html ( d . name ) ; console . log ( d ) ; var focus0 = self . focus ; self . focus = d ; var transition = d3 . transition ( ) . duration ( d3 . event . altKey ? 7500 : 750 ) . tween ( "zoom" , function ( d ) { var i = d3 . interpolateZoom ( self . view , [ self . focus . x , self . focus . y , self . focus . r * 2 + self . options . margin ] ) ; return function ( t ) { self . zoomTo ( i ( t ) ) ; } ; } ) ; transition . selectAll ( "text" ) . filter ( function ( d ) { return d . parent === self . focus || this . style . display === "inline" || d . parent === focus0 ; } ) . style ( "fill-opacity" , function ( d ) { return d . parent === self . focus ? 1 : 0.5 ; } ) . each ( "start" , function ( d ) { if ( d . parent === self . focus ) this . style . display = "inline" ; } ) . each ( "end" , function ( d ) { if ( d . parent !== self . focus ) this . style . display = "none" ; } ) ; // logos are opaque at root level only transition . selectAll ( "use" ) . style ( "opacity" , function ( d ) { return self . focus . depth === 0 ? 1 : 0.8 ; } ) ; }
a function responsible for zooming in on circles
a function responsible for zooming in on circles