Last active
August 29, 2015 14:25
-
-
Save maptastik/029ef9eb93762576f4f7 to your computer and use it in GitHub Desktop.
BCC Routes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
[user] | |
name = maptastik | |
email = ryancooper729@gmail.com | |
[core] | |
autocrlf = input | |
safecrlf = false | |
[filter "lfs"] | |
clean = git lfs clean %f | |
smudge = git lfs smudge %f | |
required = true | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
L.mapbox.accessToken = 'pk.eyJ1IjoiZ3NjcGxhbm5pbmciLCJhIjoiRVZMNXpsQSJ9.5OxUlJTCDplPkdkKNlB91A'; | |
var map = L.map('map').setView([38.046441, -84.497019], 10); | |
var base = L.tileLayer('http://{s}.basemaps.cartocdn.com/dark_all/{z}/{x}/{y}.png', { | |
attribution: '© <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a> © <a href="http://cartodb.com/attributions">CartoDB</a>', | |
subdomains: 'abcd', | |
maxZoom: 19 | |
}).addTo(map); | |
new L.geoJson({"type": "LineString","coordinates":[[0,0],[0,0]]}).addTo(map); | |
var mapsense_url = "https://{s}-api.mapsense.co/explore/api/universes/mapsense.demographics/{z}/{x}/{y}.topojson?s=10&ringSpan=8&api-key=key-b4bc5affdce44f7d86e3efdf72f5d0d4"; | |
mapsense_url += "&where=layer=='county'"; | |
new L.TileLayer.d3_JSON(mapsense_url, { | |
attribution: '<a target="_blank" href="https://developer.mapsense.co/tileViewer/?tileset=mapsense.demographics">©Mapsense ©OpenStreetMap</a>', | |
// https://developer.mapsense.co/documentation/basemap | |
mapsenseStyle: false // choose a basemap style, or style your own at styler.mapsense.co | |
}).addTo(map); | |
var bcc2013, bcc2014, bcc2015, ky, layers | |
var kyStyle = { | |
color: '#333', | |
fillOpacity: 0, | |
// opacity:0.1, | |
weight: 2 | |
} | |
var style = { | |
color: '#E80087', | |
opacity: 0.06, | |
weight: 1 | |
} | |
bcc2013 = omnivore.topojson('bcc_2013.json') | |
.on('ready', function(e) { | |
layers = e.target; | |
myStyleFunction(); | |
}).addTo(map); | |
bcc2014 = omnivore.topojson('bcc_2014.json') | |
.on('ready', function(e) { | |
layers = e.target; | |
myStyleFunction(); | |
}).addTo(map); | |
bcc2015 = omnivore.topojson('bcc_201501-201507.json') | |
.on('ready', function(e) { | |
layers = e.target; | |
myStyleFunction(); | |
}).addTo(map); | |
// ky = omnivore.topojson('ky_counties.json') | |
// .on('ready', function(e) { | |
// layers = e.target; | |
// kyStyleFunction(); | |
// }).addTo(map); | |
function kyStyleFunction() { | |
layers.setStyle(kyStyle); | |
} | |
function myStyleFunction() { | |
layers.setStyle(style); | |
} | |
L.control.layers({}, { | |
'2013': bcc2013, | |
'2014': bcc2014, | |
'2015': bcc2015 | |
},{collapsed:false}).addTo(map); | |
$( "form" ).before( "<p><strong>BCC Ride Years</strong></p>" ); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
L.TileLayer.d3_JSON = L.TileLayer.extend({ | |
//extending L.TileLayer to support topoJSON and geoJSON vector sources | |
//rendering with d3, borrows from zjonsson & https://github.com/glenrobertson/leaflet-tilelayer-geojson/ | |
onAdd: function(map) { | |
var map_container_svg = d3.select(map._container).select("svg"); | |
L.TileLayer.prototype.onAdd.call(this, map); | |
this.mapsenseStyle = this.options.mapsenseStyle; | |
this._path = d3.geo.path().projection({ | |
stream: function(stream) { | |
// no sampling along great arc | |
// just a pure projection, without the default d3 projection-stream pipeline | |
// so, long lines don't make curves, i.e. they obey the mercator projection | |
return { | |
point: function(x, y) { | |
var p = map.latLngToLayerPoint(new L.LatLng(y, x)); | |
stream.point(p.x, p.y); | |
}, | |
lineStart: stream.lineStart, | |
lineEnd: stream.lineEnd, | |
polygonStart: stream.polygonStart, | |
polygonEnd: stream.polygonEnd, | |
sphere: stream.sphere | |
}; | |
} | |
}); | |
this.on("tileunload", function(d) { | |
if (d.tile.xhr) d.tile.xhr.abort(); | |
if (d.tile.nodes) d.tile.nodes.remove(); | |
d.tile.nodes = null; | |
d.tile.xhr = null; | |
}); | |
}, | |
_loadTile: function(tile, tilePoint) { | |
var self = this; | |
this._adjustTilePoint(tilePoint); | |
var mapsenseStyle = this.mapsenseStyle; | |
if (!tile.nodes && !tile.xhr) { | |
tile.xhr = d3.json(this.getTileUrl(tilePoint), function(data) { | |
var geoJson; | |
if (data === '') { | |
// Ignore empty submissions | |
} else { | |
geoJson = topo2Geo(data); | |
} | |
tile.xhr = null; | |
nwPoint = tilePoint.multiplyBy(256); | |
sePoint = nwPoint.add([256, 256]); | |
nw = map.unproject(nwPoint); | |
se = map.unproject(sePoint); | |
var point = map.latLngToLayerPoint(new L.LatLng(nw.lat, nw.lng)); | |
var tile_coords = "tile_" + point.x + "_" + point.y; | |
d3.select(map._container).select("svg") | |
.append("clipPath") | |
.attr("id", tile_coords) | |
.attr("style", "fill: none; stroke: pink; transform: translate(" + point.x + "px, " + point.y + "px); -webkit-transform: translate(" + point.x + "px, " + point.y + "px);") | |
.append("rect") | |
.attr("width", "256") | |
.attr("height", "256"); | |
d3.select(map._container).select("svg") | |
.append("rect") | |
.attr("style", "transform: translate(" + point.x + "px, " + point.y + "px); -webkit-transform: translate(" + point.x + "px, " + point.y + "px);") | |
.attr("width", "256") | |
.attr("height", "256") | |
.attr("class", "mapsense-"+self.mapsenseStyle +" tile-background"); | |
tile.nodes = d3.select(map._container).select("svg").append("g"); | |
// tile.nodes is now a bunch of appended g's | |
var grp = tile.nodes.selectAll("path") | |
.data(geoJson.features) | |
.enter() | |
.append("g") | |
.attr("class", "groupr"); | |
grp.append("path") | |
.attr("d", self._path) | |
.attr("clip-path", "url(#" + tile_coords + ")") | |
.attr("class", self.options.class) | |
.attr("class", function(d) { // this data is a bunch of features | |
var zoomClass = "_" + Math.floor(map.getZoom()); | |
var classes = ['mapsense-'+self.mapsenseStyle]; | |
if (d.properties) { | |
if (d.properties) { | |
if (d.properties.layer) | |
classes.push(d.properties.layer); | |
if (d.properties.natural) | |
classes.push(d.properties.natural); | |
if (d.properties.sub_layer) | |
classes.push(d.properties.sub_layer); | |
} else { | |
classes.push('unknown'); | |
} | |
classes = classes.join(' '); | |
return classes; | |
} else {} | |
}); | |
}); | |
} | |
} | |
}); | |
function topologyFeatures(topology) { | |
function convert(topology, object, layer, features) { | |
var featureOrCollection = topojson.feature(topology, object), | |
layerFeatures; | |
if (featureOrCollection.type === "FeatureCollection") { | |
layerFeatures = featureOrCollection.features; | |
} else { | |
layerFeatures = [featureOrCollection]; | |
} | |
layerFeatures.forEach(function(f) { | |
f.properties.layer = layer; | |
}); | |
features.push.apply(features, layerFeatures); | |
} | |
var features = []; | |
for (var o in topology.objects) { | |
convert(topology, topology.objects[o], o, features); | |
} | |
return features; | |
} | |
function topo2Geo(tj) { | |
var gj = { | |
type: "FeatureCollection", | |
features: topologyFeatures(tj) | |
}; | |
return gj; | |
} |
View raw
(Sorry about that, but we can’t show files that are this big right now.)
View raw
(Sorry about that, but we can’t show files that are this big right now.)
View raw
(Sorry about that, but we can’t show files that are this big right now.)
View raw
(Sorry about that, but we can’t show files that are this big right now.)
View raw
(Sorry about that, but we can’t show files that are this big right now.)
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment