Skip to content

Instantly share code, notes, and snippets.

View PiotrKrosniak's full-sized avatar
🏠
Working from home

Peter Kross PiotrKrosniak

🏠
Working from home
View GitHub Profile
<script type="text/javascript">
google.load('visualization', '1', {packages: ['corechart']});
//pass the infowindow as argument, we need it later
function drawVisualization(infowindow) {
var queryText = encodeURIComponent("SELECT Year, Austria, Bulgaria, \
Denmark, Greece FROM 641716");
/*note: we don't need the ContainerId here,
we use the node-reference with draw
@PiotrKrosniak
PiotrKrosniak / fusontableslider.html
Created January 18, 2014 11:45
Gist - FusionTableSlider
<html>
<head>
<title>Slider to change fusiontable maps</title>
<link href="https://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script src="simple-slider.js"></script>
<link href="simple-slider.css" rel="stylesheet" type="text/css" />
<link href="simple-slider-volume.css" rel="stylesheet" type="text/css" />
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>jQuery Slider Fusion Table and Google Maps</title>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.8.18/jquery-ui.min.js"></script>
<script type='text/javascript' src="http://maps.google.com/maps/api/js?sensor=false&dummy=.js"></script>
<style type='text/css'>
#map-canvas { width:80%; height: 440px;
<div id="demo" class="imageReveal">
<img src="XXXXimages/1-before.jpg-XXXX" title="Before"> //first photo change to your location
<img src="XXXX-images/1-after.jpg-XXXX" title="After"> //second photo change location !
</div>
//and second paste options script inside your blog post
<script>
$(window).load(function() {
$('#demo').imageReveal({
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
//Those two scripts below You should host on your server
<script src="http://serwer1478551.home.pl/hellobags/bef-after-script/jquery.imageReveal.js"></script>
<script src="http://serwer1478551.home.pl/hellobags/bef-after-script/jquery.imageReveal.css"></script>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="UTF-8">
<title>Fusion Tables Layer Example: Dynamic Info Windows</title>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false"></script>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title> - jsBin demo</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
@PiotrKrosniak
PiotrKrosniak / map_swipe.html
Last active September 3, 2020 14:07
Google Maps Swipe Tool for compare two maps from Fusion table piotrgisworks.blogspot.com
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="A layout example that shows off a responsive pricing table.">
<title>Google Map Swipe Effect | Tutorial on piotrgisworks.blogpot.com</title>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>
<link rel="stylesheet" href="http://yui.yahooapis.com/pure/0.3.0/pure-min.css">
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?&sensor=false"></script>
<link rel="stylesheet" href="http://cartodb.github.io/odyssey.js/sandbox/css/slides.css">
<script type="text/javascript">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</script></head>
<body onload="initialize();">