User Tools

Site Tools


playground:playground

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
playground:playground [2014/12/08 21:55]
jasonkarl
playground:playground [2014/12/10 16:38] (current)
jasonkarl
Line 1: Line 1:
 ==== test2 ==== ==== test2 ====
 +
 +<​PRELOAD>​
 +  http://​ajax.googleapis.com/​ajax/​libs/​jquery/​1.6.4/​jquery.min.js?​ver=1.4.2
 +  http://​cdn.leafletjs.com/​leaflet-0.7.3/​leaflet.js
 +  http://​cdn.leafletjs.com/​leaflet-0.7.3/​leaflet.css
 +  http://​leaflet.github.io/​Leaflet.markercluster/​dist/​MarkerCluster.css
 +  http://​leaflet.github.io/​Leaflet.markercluster/​dist/​MarkerCluster.Default.css
 +  http://​leaflet.github.io/​Leaflet.markercluster/​dist/​leaflet.markercluster-src.js
 +  https://​rawgit.com/​JournalMap/​API_examples/​master/​jmap_widget.js
 +</​PRELOAD>​
  
 <​HTML>​ <​HTML>​
- 
- <script type='​text/​javascript'​ src='​http://​ajax.googleapis.com/​ajax/​libs/​jquery/​1.6.4/​jquery.min.js?​ver=1.4.2'></​script>​ 
- <script src="​http://​cdn.leafletjs.com/​leaflet-0.7.3/​leaflet.js"></​script>​ 
- <link rel="​stylesheet"​ href="​http://​cdn.leafletjs.com/​leaflet-0.7.3/​leaflet.css"​ /> 
- <link rel="​stylesheet"​ href="​http://​leaflet.github.io/​Leaflet.markercluster/​dist/​MarkerCluster.css"​ /> 
- <link rel="​stylesheet"​ href="​http://​leaflet.github.io/​Leaflet.markercluster/​dist/​MarkerCluster.Default.css"​ /> 
- <script src="​http://​leaflet.github.io/​Leaflet.markercluster/​dist/​leaflet.markercluster-src.js"></​script>​ 
- 
 <div id="​jmap"​ style="​height:​500px;​ width:​600px"​ ></​div>​ <div id="​jmap"​ style="​height:​500px;​ width:​600px"​ ></​div>​
 +</​HTML>​
  
 +<JS>
 +  var apikey = '​aKesQixBxBcyA4SaucuD';​ var collectionID = 2; var centerLat = 42; var centerLon = -100; var Zoom = 3;
 +  JMap(apikey,​collectionID);​
 +</JS>
  
-  <​script>​ 
-  var collectionID = 2; 
-  var centerLat = 42; 
-  var centerLon = -100; 
-  var Zoom = 3; 
-  ​ 
-  ​ 
- var buildCitation = function(title,​authors,​year,​journal,​vol,​iss,​spage,​epage) { 
- authorlist = '';​ 
- for (i = 0; i < authors.length;​ i++) { 
- if (i===0) { 
- var sep = '';​ 
- } else if (i===(authors.length-1)) { 
- sep = ' and '; 
- } else { 
- sep = ', '; 
- } 
- authorlist += sep+authors[i];​ 
- } 
- return(authorlist+'​ '​+year+'​. '​+title+'​. '​+'<​em>'​+journal+'</​em>'​);​ 
- }; 
  
- var buildDOIlink = function(doi) { 
- return('<​a href="​http://​dx.doi.org/'​+doi+'"​ target="​_blank">'​+doi+'</​a>'​);​ 
- }; 
- 
-  $(document).ready(function() { 
-    ​ $.getJSON("​http://​www.journalmap.org/​api/​collections/"​+collectionID+"​.json?​key=aKesQixBxBcyA4SaucuD&​version=1.0",​function(collection){ 
-   var title = collection.title;​ 
-   var description = collection.description;​ 
-   var intro = collection.intro;​ 
-   $("#​jmap"​).before("<​h3>"​+title+"</​h3><​em>"​+intro+"</​em>"​);​ 
-  }); ​    
-     
-     
-  var map = L.map('​jmap'​).setView([centerLat,​ centerLon], Zoom); 
-  maplink = '<a href="​http://​openstreetmap.org">​OpenStreetMap</​a>';​ 
- landlink = '<a href="​http://​thunderforest.com/">​Thunderforest</​a>'; ​ 
- cclink = '<a href="​http://​creativecommons.org/​licenses/​by-sa/​2.0/">​CC-BY-SA</​a>';​ 
- leaflink = '<a href="​http://​leafletjs.com">​Leaflet</​a>';​ 
- L.tileLayer('​http://​{s}.tile.thunderforest.com/​landscape/​{z}/​{x}/​{y}.png',​ { 
- ​  ​  ​maxZoom:​ 18, 
- }).addTo(map);​ 
-  
- var markers = L.markerClusterGroup();​ 
-  
- $.getJSON('​http://​www.journalmap.org/​api/​articles.json?​key=aKesQixBxBcyA4SaucuD&​version=1.0&​filters[collection_id][]='​+collectionID,​function(articles){  
-    $.each(articles,​function(i,​article) { 
- authorlist = [] 
- $.each(article.authors,​function(a,​authors) { 
- authorlist[authorlist.length] = authors.last_name + ", " + authors.first_name;​ 
- }); 
-    var citation = buildCitation(article.title,​authorlist,"​9999",​article.publication.name,​article.volume,​article.issue,​article.start_page,​article.end_page);​ 
-    $.each(article.locations,​function(j,​loc) { 
-    //​console.log(loc.latitude);​ 
-    var marker = L.marker([loc.latitude,​loc.longitude]);​ 
-    marker.bindPopup("<​strong>"​+article.title+"</​strong><​p>"​+citation+"<​p><​strong>​DOI:​ </​strong>"​+buildDOIlink(article.doi)); ​ 
-    markers.addLayer(marker);​ 
-    }); 
-    }); 
-    map.addLayer(markers);​ 
-    }); 
-  
-  
- //​map.attributionControl.setPrefix('<​a href="​http://​www.journalmap.org"><​img src="​jmap_logo.png"​ width="​100px"></​a>'​);​ 
- map.attributionControl.addAttribution('​Maps &copy; '​+landlink+',​ Data &copy; '​+maplink+',​ '​+cclink+'​ | <a href="​http://​www.journalmap.org">​JournalMap</​a>​ data provided CC-BY-SA'​);​ 
- 
- $("#​jmap"​).after('<​a href="​http://​www.journalmap.org"><​img src="​jmap_logo.png"​ width="​150px"></​a>'​);​ 
- 
- }); 
- 
-  ​ 
-  </​script>​ 
- 
- 
-</​HTML>​ 
  
playground/playground.1418100925.txt.gz ยท Last modified: 2014/12/08 21:55 by jasonkarl