Skip to content

Commit

Permalink
minor updates
Browse files Browse the repository at this point in the history
  • Loading branch information
trivisonno committed Feb 17, 2024
1 parent 84dd349 commit 8296b5d
Show file tree
Hide file tree
Showing 4 changed files with 195 additions and 29 deletions.
50 changes: 44 additions & 6 deletions crosssection.html
Original file line number Diff line number Diff line change
Expand Up @@ -451,7 +451,8 @@
<div class="input-group mb-3">
<label class="col-sm-7 col-form-label">oneway:bicycle</label>
<select id="oneway:bicycle" class="form-select form-select-sm" aria-label="Default select example" aria-describedby="basic-addon1">
<option value="" selected>yes</option>
<option value="" selected></option>
<option value="yes">yes</option>
<option value="no">no</option>
</select>
</div>
Expand Down Expand Up @@ -482,6 +483,7 @@
</form>
<div id="code" style="float:left;padding:0px;width:100%"></div>
<button id="dlJson" type="button" class="btn btn-primary">Copy OSM tags</button>
<button id="openOSMedit" type="button" class="btn btn-primary">Open OSM editor</button>
</div>

<!-- <button class="btn btn-primary" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasRight" aria-controls="offcanvasRight" style="float:right;">View map</button> -->
Expand All @@ -490,6 +492,7 @@
<div id="map" style="float:right;width:100%;height:400px">Loading map geometry...</div>
<span style="border-top:2px solid red; border-bottom:2px solid blue;padding:0px;margin:5px;float:left"><input type="number" id="centerlineOffset" name="centerlineOffset" step="0.5" value="0"></span>
<br><button id="newTileLayer" type="button" class="btn btn-primary">Switch tile layer</button>

</div>

</div>
Expand Down Expand Up @@ -552,6 +555,10 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
.addTo(map);
});

$('#openOSMedit').on('click', function(e) {
window.open("https://www.openstreetmap.org/edit?way="+findGetParameter('id'), "_blank");
});



function loadFeature() {
Expand Down Expand Up @@ -582,6 +589,35 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
matchElements();
loadCrossSection(feature)
drawLanes(streetsAsGeojson)

streetStats = {
'total_shared_lane': 0,
'total_bike_lane': 0,
'total_separated_cycleway': 0,
'total_cycleway_highway': 0,
'total_residential_etc': 0,
'shared_25': 0,
'shared_35': 0,
'primary': 0,
'secondary': 0,
'tertiary': 0,
'primary_no_bikeinfra': 0,
'secondary_no_bikeinfra': 0,
'tertiary_no_bikeinfra': 0,
'primary_cyclelane': 0,
'secondary_cyclelane': 0,
'tertiary_cyclelane': 0,
'residential_cyclelane': 0,
'primary_sharedlane': 0,
'secondary_sharedlane': 0,
'tertiary_sharedlane': 0,
'residential_sharedlane': 0
}
console.log(streetsAsGeojson)
console.log(feature)
streetsAsGeojson['features'][0]['properties'] = feature['properties']
streetStats = (calcStreetStats(streetsAsGeojson['features'][0]))
console.log(streetStats)
});

function matchElements() {
Expand Down Expand Up @@ -1122,7 +1158,7 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
crossSectionInfo = generateCrossSectionTable(feature)
// console.log(crossSectionInfo)
offsetArray = crossSectionInfo['offsetArray']
// console.log(offsetArray)
console.log(offsetArray)
html = "<center><div style='padding-top:5px;display:inline-block;background-color:#a9ccdb;border-left:7px solid red;border-right:7px solid blue'><div id='streetName' style='display:block;margin-bottom:20px;'>"+streetName+"</div>"+crossSectionInfo['html'] + "</div></center></div>"
$('#content').html(html);

Expand All @@ -1148,6 +1184,8 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
document.title = $('#streetName').text() + " - CrossSection+"




}


Expand Down Expand Up @@ -1186,7 +1224,7 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
map.fitBounds(streetLayer.getBounds());
// console.log(streetsAsGeojson)
drawLanes(streetsAsGeojson)
calcStreetStats(streetsAsGeojson['features'][0])

return streetsAsGeojson;
});

Expand All @@ -1201,8 +1239,8 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>

if (typeof streetsAsGeojson !== 'undefined') {
for (i = 0; i < offsetArray.length; i++) {
// console.log((((offsetArray.at(-1)/2)-offsetArray[i])*12))
// console.log(streetsAsGeojson)
console.log((((offsetArray.at(-1)/2)-offsetArray[i])*12))
console.log(streetsAsGeojson)
L.geoJson(getLineOffset(streetsAsGeojson['features'][0], (((offsetArray.at(-1)/2)-offsetArray[i]+Number($('#centerlineOffset').val()))*12), {units: 'inches'}), {
style: function(feature){
if (i==0 ) {
Expand Down Expand Up @@ -1256,7 +1294,7 @@ <h5 id="offcanvasRightLabel">Aerial Lane Viewer</h5>
navigator.clipboard.writeText(text);

// Alert the copied text
alert("Copied the text: " + text);
alert("Copied the text:\n\n" + text);
}


Expand Down
18 changes: 18 additions & 0 deletions js/calcstats.js
Original file line number Diff line number Diff line change
Expand Up @@ -60,14 +60,17 @@ function calcStreetStats(feature) {
// //console.log(getStreetLineStringWithinBoundary(feature));
// feature.geometry.coordinates = getStreetLineStringWithinBoundary(feature).geometry.coordinates;
// }
// console.log(feature)
if(Object.keys(feature.properties.tags).includes('maxspeed')) {
maxspeed = Number(feature.properties.tags['maxspeed'].split(" ")[0]);
}

var length = turf.length(feature, {
units: 'miles'
})
// console.log('length: ', length)


if(Object.keys(feature.properties.tags).includes('bicycle') == true && Object.keys(feature.properties.tags).includes('motor_vehicle') == true) {
if(feature.properties.tags['bicycle'] == 'yes' && feature.properties.tags['motor_vehicle'] == 'no' && (feature.properties.tags['highway'] == "trunk" || feature.properties.tags['highway'] == "trunk_link" || feature.properties.tags['highway'] == "primary" || feature.properties.tags['highway'] == "primary_link" || feature.properties.tags['highway'] == "secondary" || feature.properties.tags['highway'] == "secondary_link" || feature.properties.tags['highway'] == "tertiary" || feature.properties.tags['highway'] == "tertiary_link")) {
carsBanned = true;
Expand All @@ -90,7 +93,9 @@ function calcStreetStats(feature) {
} else if((feature.properties.tags['highway'] == "tertiary" || feature.properties.tags['highway'] == "tertiary_link") && carsBanned==false) {
if (feature.properties.tags['oneway']=='yes') {
streetStats.tertiary += length
// console.log('*1')
} else {
// console.log('*2')
streetStats.tertiary += length * 2
}
}
Expand Down Expand Up @@ -232,6 +237,12 @@ function calcStreetStats(feature) {
} else if(feature.properties.tags['highway'] == 'residential' || feature.properties.tags['highway'] == 'unclassified' || feature.properties.tags['highway'] == 'service') {
streetStats.residential_cyclelane += length * 2
}

//
if (feature.properties.tags['oneway:bicycle']=='yes' && feature.properties.tags['oneway']=='yes' && (feature.properties.tags['cycleway'] == "lane" || feature.properties.tags['cycleway:both'] == "lane")) {

}
//
}

if(feature.properties.tags['cycleway:left'] == "lane") {
Expand Down Expand Up @@ -311,8 +322,14 @@ function calcStreetStats(feature) {

if (feature.properties.tags['oneway']=='yes') {
streetStats.primary_no_bikeinfra += length
if (feature.properties.tags['name']=='Lorain Avenue') {
console.log(length, feature.properties['id'])
}
} else {
streetStats.primary_no_bikeinfra += length * 2
if (feature.properties.tags['name']=='Lorain Avenue') {
console.log(length * 2, feature.properties['id'])
}
}

if(Object.keys(feature.properties.tags).includes('name') == true) {
Expand Down Expand Up @@ -466,6 +483,7 @@ function calcStreetStats(feature) {
}
}
}
return streetStats;
}


Expand Down
44 changes: 35 additions & 9 deletions js/osmtostreetmix.js
Original file line number Diff line number Diff line change
Expand Up @@ -139,6 +139,12 @@ function generateCrossSectionTable(feature) {
}


// when oneway=yes and cycleway=lane, we need to switch this to cycleway:right=lane
if (tags['oneway']=='yes' && tags['oneway:bicycle']!="no" && tags['cycleway']=='lane') {
tags['cycleway:right'] = 'lane'
delete tags['cycleway']
}

// console.log(widthBike)

vehicleRowHeight = 0.7 * pixelsPerInch * 10
Expand Down Expand Up @@ -430,16 +436,25 @@ function generateCrossSectionTable(feature) {



// console.log(tags, lanesForward, lanesBackward)


if (Object.keys(tags).includes('cycleway') || Object.keys(tags).includes('cycleway:both') || Object.keys(tags).includes('cycleway:left') || Object.keys(tags).includes('cycleway:right')) {
if ( tags['cycleway'] == 'lane') {
tdNum += 2
if ( tags['oneway'] == 'yes' ) {
tdNum += 1
} else {
tdNum += 2
}

}


}

// console.log(tags, lanesForward, lanesBackward, tdNum)

// START DRAWING THE CROSS SECTION WITH IMGS

if (Object.keys(tags).includes('cycleway:right:traffic_mode:left') == false && tags['cycleway:right:traffic_mode:left'] !== 'parking') {
if (tags['parking:lane:both']=='parallel' || tags['parking:lane:right']=='parallel') {
if (Object.keys(tags).includes('parking:lane:right:parallel') == true && tags['parking:lane:right:parallel'] == 'street_side') {
Expand Down Expand Up @@ -812,7 +827,7 @@ function generateCrossSectionTable(feature) {
if (Object.keys(tags).includes('cycleway:lanes:backward') == false || tags['cycleway:lanes:backward'].split("|")[0] != 'no') {
if (tags['cycleway']=='lane' || tags['cycleway:both']=='lane' || tags['cycleway:left']=='lane') {
if ((tags['oneway:bicycle']=='no' || tags['cycleway:left:oneway']=='no')) {
html += "<td style='width: "+widthBike+"px; height: "+markingRowHeight+"px; background: url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/straight-inbound.svg) no-repeat top center, url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/lane-right.svg) no-repeat top right;border-left:4px solid white; background-color: green';'></td>"
// html += "<td style='width: "+widthBike+"px; height: "+markingRowHeight+"px; background: url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/straight-inbound.svg) no-repeat top center, url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/lane-right.svg) no-repeat top right;border-left:4px solid white; background-color: green';'></td>"
html += "<td style='width: "+widthBike+"px; height: "+markingRowHeight+"px; background: url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/straight-outbound.svg) no-repeat top center, url(https://raw.githubusercontent.com/streetmix/illustrations/main/images/markings/lane-right.svg) no-repeat top right;background-color: green';'></td>"
} else {
if (tags['oneway']=='yes') {
Expand Down Expand Up @@ -966,6 +981,7 @@ function generateCrossSectionTable(feature) {
html += "<td style='text-align: center;max-width: "+lanesForwardWidth[i]+"px;'>Bus lane</td>"
totalStreetWidth += lanesForwardWidth[i]/pixelsPerInch
offsetArray.push(totalStreetWidth)
// console.log(lanesForwardWidth,lanesForwardWidth[i],pixelsPerInch,totalStreetWidth, offsetArray)
}

if (middleLane) {
Expand Down Expand Up @@ -1035,15 +1051,25 @@ function generateCrossSectionTable(feature) {
}

if (Object.keys(tags).includes('cycleway:lanes:backward') == false || tags['cycleway:lanes:backward'].split("|")[0] != 'no') {
if ((tags['cycleway']=='lane' && tags['oneway']!="yes") || tags['cycleway:both']=='lane' || tags['cycleway:left']=='lane' || (tags['oneway']=='yes' && tags['cycleway:left']=='lane')) {
if (tags['cycleway:left:oneway']=='no') {
if (tags['cycleway']=='lane' || tags['cycleway:both']=='lane' || tags['cycleway:left']=='lane') {
if ((tags['oneway:bicycle']=='no' || tags['cycleway:left:oneway']=='no')) {
html += "<td style='text-align: center;max-width: "+widthBike+"px;'>Bike lane</td>"
totalStreetWidth += widthBike/pixelsPerInch
offsetArray.push(totalStreetWidth)
}
html += "<td style='text-align: center;max-width: "+widthBike+"px;'>Bike lane</td>"
totalStreetWidth += widthBike/pixelsPerInch
offsetArray.push(totalStreetWidth)
} else {
if (tags['oneway']=='yes') {
html += "<td style='text-align: center;max-width: "+widthBike+"px;'>Bike lane</td>"
totalStreetWidth += widthBike/pixelsPerInch
offsetArray.push(totalStreetWidth)
} else {
html += "<td style='text-align: center;max-width: "+widthBike+"px;'>Bike lane</td>"
totalStreetWidth += widthBike/pixelsPerInch
offsetArray.push(totalStreetWidth)
}
// html += "<td style='text-align: center;max-width: "+widthBike+"px;'>Bike lane</td>"
// totalStreetWidth += widthBike/pixelsPerInch
// offsetArray.push(totalStreetWidth)
}
}
}

Expand Down
Loading

0 comments on commit 8296b5d

Please sign in to comment.