m3.js

    var json = 'http://wsjgraphics.cartodb.com/api/v2/viz/8e5d6502-c098-11e3-8209-0edbca4b5057/viz.json';

    m3({
        mapId: 'nmap',
        json: json,
        center_lat: 49,
        center_lon: 36,
        zoom: 5,
        maxZoom: 7,
        minZoom: 4,
        // optional top-left & bottom-right boundaries
        maxBounds: [ [63.415, 12.311],[34.726, 64.511] ]
    });








function m3(options){
	m3.options = options;
    window._m3_ = m3;
    
    loadInMapScripts(function(){
    	m3.map = cartodb.createVis(m3.options.mapId, m3.options.json, {
            // zoomControl: false,
    		loaderControl: false,
    		cartodb_logo: false,
    		center_lat: m3.options.center_lat,
    		center_lon: m3.options.center_lon,
    		zoom: m3.options.zoom
    	})
    	.done(function(v, l) {
    		m3.vis = v;
    		m3.layers = l;
    		m3.subLayers = l[1].getSubLayers();
    		m3.setup();
    	});
    });
    
    // load external Carto scripts only when m3 is called
    function loadInMapScripts(callback){
        $.getScript( "http://libs.cartocdn.com/cartodb.js/v3/cartodb.js", function() {
            $('head').append('<link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.css" type="text/css" /><!--[if lte IE 8]><link rel="stylesheet" href="http://libs.cartocdn.com/cartodb.js/v3/themes/css/cartodb.ie.css" /><![endif]-->');
            callback();
        });    
    }
    
	
}

m3.setup = function(){
    
    // prevent zoom by clicking or scrolling
    m3.vis.getNativeMap().doubleClickZoom.disable();
    m3.vis.getNativeMap().scrollWheelZoom.disable();
    
    // set max/min zoom
    if (m3.options.minZoom) {
        m3.map.getNativeMap().options.minZoom = m3.options.minZoom;
    }
    if (m3.options.maxZoom) {
        m3.map.getNativeMap().options.maxZoom = m3.options.maxZoom;
    }
    
    
    // set boundaries of map
    if(m3.options.maxBounds){
        m3.map.getNativeMap().setMaxBounds(m3.options.maxBounds);
    }
    	
	// disable mobile hamburger legend
	$('.cartodb-mobile.legends').removeClass('cartodb-mobile');
    	
	// hide any unnecessary legend(s)
	// vis.legends.options.legends[1].hide();

    if(m3.options.dl) {
    	// hide all layers
    	m3.hideAllLayers();
    	// show default layer
        if (typeof m3.options.dl === 'Array') {
            for (var i = 0; i < m3.options.dl.length; i++) {
                var l = m3.options.dl[i]
            	m3.subLayers[l].show();
            }
        } else {
            m3.subLayers[m3.options.dl].show();
        }
    }
	
	
    // set interactivity (if needed)
    for (var i = 0; i < m3.subLayers.length; i++) {
        m3.subLayers[i].setInteraction(true);
        m3.subLayers[i].set({
            interactivity: ["cartodb_id","country","d1995","d2009"]
        });
    };
	
    // add tooltip (if needed)
	m3.addTooltip(m3.options.dl);
	
};

m3.hideAllLayers = function(){
	for (var i = 0; i < m3.subLayers.length; i++) {
		m3.subLayers[i].hide();
	}
	
}

m3.switchToLayer = function(index){
	m3.hideAllLayers();
	m3.subLayers[index].show();	
};

m3.addTooltip = function(index){
	if ( m3.tooltip ) {
		m3.tooltip.remove();
		m3.tooltip = null;
	}
	// make sure to set interactivity in m3.setup()
	if (index === 0) {
		var data = 'd1995';
	} else {
		var data = 'd2009';
	}
	m3.tooltip = m3.vis.addOverlay({
        layer: m3.layers[1].getSubLayer(0),
        type: 'tooltip',
        template: '<p class="tooltip">{{country}}: <span>{{'+data+'}}</span> yrs</p>\
          <script>var t = parseFloat( $(".tooltip span").text() ); var n = Math.round( t * 10) / 10; n.toString().indexOf(".") < 0 ? n += ".0" : null; $(".tooltip span").text(n);</script>'
	});
}