owah
This commit is contained in:
parent
3fd2362c6a
commit
745da9107a
@ -41,7 +41,7 @@ code {font-family: "Consolas", "Ubuntu Mono", monospace; line-height: 22px; font
|
|||||||
.fauxButton .selected {background-color: #FF4646;}
|
.fauxButton .selected {background-color: #FF4646;}
|
||||||
.colorText {color: #FF4646; text-transform: uppercase; font-weight: 700;}
|
.colorText {color: #FF4646; text-transform: uppercase; font-weight: 700;}
|
||||||
|
|
||||||
.leaflet-popup-content h2 {font-family: Lato; font-size: 20px; text-transform: uppercase;}
|
.leaflet-popup-content h2 {font-family: Lato; font-size: 14px; text-transform: uppercase;}
|
||||||
|
|
||||||
#rightSide {height: 400px; max-width: 350px; width: 100%; float: right; padding-top: 5px;}
|
#rightSide {height: 400px; max-width: 350px; width: 100%; float: right; padding-top: 5px;}
|
||||||
#selectedSpot {display: none;}
|
#selectedSpot {display: none;}
|
||||||
|
59
index.html
59
index.html
@ -118,26 +118,13 @@
|
|||||||
$('#selectedSpot').html(selectedSpot).css("display", "inline")
|
$('#selectedSpot').html(selectedSpot).css("display", "inline")
|
||||||
var selectedCoords = [dataElement[0].lat, dataElement[0].long]
|
var selectedCoords = [dataElement[0].lat, dataElement[0].long]
|
||||||
console.log(selectedCoords)
|
console.log(selectedCoords)
|
||||||
matchGeoJSONbyRowNumber(rowNumber, geoJSON, "#FF4646")
|
matchGeoJSONbyRowNumber(rowNumber, geoJSON, gData, "#FF4646")
|
||||||
console.log(geoJSON)
|
console.log(geoJSON)
|
||||||
Sheetsee.addMarkerLayer(geoJSON, map, 11)
|
var markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 11)
|
||||||
|
addPopups(map, markerLayer)
|
||||||
map.setView(selectedCoords, 13)
|
map.setView(selectedCoords, 13)
|
||||||
})
|
})
|
||||||
|
|
||||||
function matchGeoJSONbyRowNumber(rowNumber, geoJSON, highlightColor) {
|
|
||||||
geoJSON.forEach(function (d) {
|
|
||||||
for (var key in d.opts) {
|
|
||||||
var value = d.opts[key].toString().toLowerCase()
|
|
||||||
if (key === 'rowNumber' && value.match(rowNumber.toString().toLowerCase())) {
|
|
||||||
d.properties["marker-color"] = highlightColor
|
|
||||||
return geoJSON
|
|
||||||
}
|
|
||||||
// else { console.log("no match") }
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
var theLatestSpot = gData.reverse()[0]
|
var theLatestSpot = gData.reverse()[0]
|
||||||
var latestSpot = ich.latestSpot({
|
var latestSpot = ich.latestSpot({
|
||||||
rows: theLatestSpot
|
rows: theLatestSpot
|
||||||
@ -160,7 +147,6 @@
|
|||||||
var optionsJSON = ["name", "address", "city", "rowNumber"]
|
var optionsJSON = ["name", "address", "city", "rowNumber"]
|
||||||
var geoJSONnoHL = Sheetsee.createGeoJSON(gData, optionsJSON)
|
var geoJSONnoHL = Sheetsee.createGeoJSON(gData, optionsJSON)
|
||||||
var geoJSON = highlightLastMarker(geoJSONnoHL, "#FF4646")
|
var geoJSON = highlightLastMarker(geoJSONnoHL, "#FF4646")
|
||||||
console.log(geoJSON[0].properties)
|
|
||||||
// geoJSON[0].properties["maker-color"] = "#E5FF1D"
|
// geoJSON[0].properties["maker-color"] = "#E5FF1D"
|
||||||
var map = Sheetsee.loadMap("map")
|
var map = Sheetsee.loadMap("map")
|
||||||
Sheetsee.addTileLayer(map, 'examples.map-20v6611k')
|
Sheetsee.addTileLayer(map, 'examples.map-20v6611k')
|
||||||
@ -169,11 +155,29 @@
|
|||||||
|
|
||||||
function addPopups(map, markerLayer) {
|
function addPopups(map, markerLayer) {
|
||||||
markerLayer.on('click', function(e) {
|
markerLayer.on('click', function(e) {
|
||||||
|
// e.layer.feature["marker-color"] = "#ff00ff"
|
||||||
|
// map.marker(geoJSON, map, 11).addTo(map)
|
||||||
|
$('.spotRow').removeClass("selectedRow")
|
||||||
|
var rowNumber = e.layer.feature.opts.rowNumber.toString()
|
||||||
|
$('#' + rowNumber).addClass("selectedRow")
|
||||||
|
matchGeoJSONbyRowNumber(rowNumber, geoJSON, gData, "#FF4646")
|
||||||
|
console.log(geoJSON)
|
||||||
|
var markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 11)
|
||||||
|
addPopups(map, markerLayer)
|
||||||
|
var dataElement = Sheetsee.getMatches(gData, rowNumber, "rowNumber")
|
||||||
|
console.log("rowNumber", rowNumber, "dataElement", dataElement)
|
||||||
|
var selectedSpot = ich.selectedSpot({
|
||||||
|
rows: dataElement
|
||||||
|
})
|
||||||
|
$('#latestSpot').css("display", "none")
|
||||||
|
$('#selectedSpot').html(selectedSpot).css("display", "inline")
|
||||||
var feature = e.layer.feature
|
var feature = e.layer.feature
|
||||||
var popupContent = '<h2>' + feature.opts.name + '</h2>'
|
var popupContent = '<h2>' + feature.opts.name + '</h2>'
|
||||||
e.layer.bindPopup(popupContent,{closeButton: false,})
|
e.layer.bindPopup(popupContent,{closeButton: true,})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
// .addControl(L.mapbox.geocoderControl('examples.map-vyofok3q'));
|
||||||
|
|
||||||
$('.resetMap').click(function() {
|
$('.resetMap').click(function() {
|
||||||
$('.spotRow').removeClass("selectedRow")
|
$('.spotRow').removeClass("selectedRow")
|
||||||
markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 11)
|
markerLayer = Sheetsee.addMarkerLayer(geoJSON, map, 11)
|
||||||
@ -181,10 +185,27 @@
|
|||||||
$('#selectedSpot').css("display", "none")
|
$('#selectedSpot').css("display", "none")
|
||||||
})
|
})
|
||||||
|
|
||||||
|
function matchGeoJSONbyRowNumber(rowNumber, geoJSON, gdata, highlightColor) {
|
||||||
|
geoJSON.forEach(function (d) {
|
||||||
|
if (d.properties["marker-color"] === highlightColor) {
|
||||||
|
var origColor = gData[0].hexcolor
|
||||||
|
d.properties["marker-color"] = origColor
|
||||||
|
}
|
||||||
|
|
||||||
|
for (var key in d.opts) {
|
||||||
|
var value = d.opts[key].toString().toLowerCase()
|
||||||
|
if (key === 'rowNumber' && value.match(rowNumber.toString().toLowerCase())) {
|
||||||
|
d.properties["marker-color"] = highlightColor
|
||||||
|
return geoJSON
|
||||||
|
}
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
console.log(gData)
|
// console.log(gData)
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
0
js/site.js
Normal file
0
js/site.js
Normal file
Loading…
Reference in New Issue
Block a user