JS for wind turbine map. Online at: http://wcfcourier.com/interactive-a-look-at-the-growth-of-wind-energy-across/html_1d635aea-59a8-11e1-b8b1-0019bb2963f4.html

Turbine_JS

var FetchLayer;
var increment;
var wind_options;
var wind;
var map;
var center;
var fetch_tile_1997;
var fetch_tile_1998;
var fetch_tile_1999;
var overlayArray = [];

$(document).ready(function() {    
    var map = null;
    var center = new google.maps.LatLng(42.25, -93.4);

    function fetch_tile_1997(coord, zoom) {
        return "./tiles/tiles_1997/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_1998(coord, zoom) {
        return "./tiles/tiles_1998/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_1999(coord, zoom) {
        return "./tiles/tiles_1999/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2000(coord, zoom) {
        return "./tiles/tiles_2000/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2001(coord, zoom) {
        return "./tiles/tiles_2001/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2002(coord, zoom) {
        return "./tiles/tiles_2002/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2003(coord, zoom) {
        return "./tiles/tiles_2003/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2004(coord, zoom) {
        return "./tiles/tiles_2004/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2005(coord, zoom) {
        return "./tiles/tiles_2005/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2006(coord, zoom) {
        return "./tiles/tiles_2006/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2007(coord, zoom) {
        return "./tiles/tiles_2007/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    function fetch_tile_2008(coord, zoom) {
        return "./tiles/tiles_2008/" + 
        zoom + "/" + coord.x + "/" + coord.y + ".png";
    }
    
    wind_options = {
        getTileUrl: fetch_tile_1997,
        tileSize: new google.maps.Size(256, 256),
        isPng: true
    }
    wind = new google.maps.ImageMapType(wind_options);
    
    map_options = {
        minZoom: 7,
        maxZoom: 7,
        zoom: 7,
        center: center,
        mapTypeControl: false,
        streetViewControl: false,
        panControl: false,
        zoomControl: false,
        draggable: false,
        mapTypeId: google.maps.MapTypeId.TERRAIN
    };  
    map = new google.maps.Map(document.getElementById("map_canvas"), map_options);
    
    var overlayArray = map.overlayMapTypes;
    overlayArray.push(wind);
    
    $( "#slider" ).slider();
    var sliderBar = $('#slider'),
    		play_btn = $('#play-btn');

    		//slider options
    		sliderBar.slider({
    			'value':0,
    			'min': 1997,
    			'max': 2008,
    		
    		change: function(event, ui) {
    		    var increment = ui.value;
    		    var FetchLayer = 'fetch_tile_' + increment;
    		    if (FetchLayer == 'fetch_tile_1997'){
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_1997,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_1998') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_1998,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_1999') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_1999,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2000') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2000,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2001') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2001,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2002') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2002,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2003') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2003,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2004') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2004,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2005') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2005,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2006') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2006,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2007') {
    		        overlayArray.clear(wind);
    		        wind_options = {
    		            getTileUrl: fetch_tile_2007,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    } else if (FetchLayer == 'fetch_tile_2008') {
    		        overlayArray.clear(wind);  
    		        wind_options = {
    		            getTileUrl: fetch_tile_2008,
                        tileSize: new google.maps.Size(256, 256),
                        isPng: true
                    }
                    wind = new google.maps.ImageMapType(wind_options);
                    overlayArray.push(wind);
    		    }
    		}
    })
});