Fix hectares and acres calculation and display
This commit is contained in:
parent
a5a8c16363
commit
de9027434f
|
|
@ -5,6 +5,7 @@
|
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>GeoJSON Viewer</title>
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/leaflet/1.9.4/leaflet.min.css" />
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/Turf.js/6.5.0/turf.min.js"></script>
|
||||
<link rel="stylesheet" href="../theme.css">
|
||||
<link rel="icon" type="image/x-icon" href="../res/pin.png">
|
||||
<style>
|
||||
|
|
@ -384,9 +385,9 @@
|
|||
</head>
|
||||
<body>
|
||||
<script>
|
||||
// if (sessionStorage.getItem('authenticated') !== 'true') {
|
||||
// window.location.href = '../login.html';
|
||||
// }
|
||||
if (sessionStorage.getItem('authenticated') !== 'true') {
|
||||
window.location.href = '../login.html';
|
||||
}
|
||||
</script>
|
||||
|
||||
<header>
|
||||
|
|
|
|||
|
|
@ -519,6 +519,18 @@
|
|||
return false;
|
||||
}
|
||||
|
||||
// Inject calculated area directly into feature properties
|
||||
features.forEach(feature => {
|
||||
if (!feature.properties) feature.properties = {};
|
||||
const areaM2 = getFeatureArea(feature);
|
||||
|
||||
if (areaM2 > 0) {
|
||||
const { hectares, acres } = convertArea(areaM2);
|
||||
feature.properties['Area (ha)'] = Number(hectares.toFixed(2));
|
||||
feature.properties['Area (acres)'] = Number(acres.toFixed(2));
|
||||
}
|
||||
});
|
||||
|
||||
// Create layer with popups
|
||||
geojsonLayer = L.geoJSON(geojson, {
|
||||
onEachFeature: (feature, layer) => {
|
||||
|
|
@ -726,7 +738,6 @@
|
|||
|
||||
if (features.length === 0) return;
|
||||
|
||||
// Collect all unique property keys
|
||||
const allKeys = new Set();
|
||||
features.forEach(f => {
|
||||
if (f.properties) {
|
||||
|
|
@ -734,11 +745,6 @@
|
|||
}
|
||||
});
|
||||
|
||||
// Add area columns
|
||||
allKeys.add('Area (ha)');
|
||||
allKeys.add('Area (acres)');
|
||||
|
||||
// Create header
|
||||
const headerKeys = Array.from(allKeys);
|
||||
headerKeys.forEach(key => {
|
||||
const th = document.createElement('th');
|
||||
|
|
@ -746,7 +752,6 @@
|
|||
tableHeader.appendChild(th);
|
||||
});
|
||||
|
||||
// Create rows
|
||||
features.forEach((feature, idx) => {
|
||||
const row = document.createElement('tr');
|
||||
row.style.cursor = 'pointer';
|
||||
|
|
@ -755,18 +760,10 @@
|
|||
row.addEventListener('mouseout', () => row.style.backgroundColor = '');
|
||||
|
||||
const props = feature.properties || {};
|
||||
const areaM2 = getFeatureArea(feature);
|
||||
const { hectares, acres } = convertArea(areaM2);
|
||||
|
||||
headerKeys.forEach(key => {
|
||||
const td = document.createElement('td');
|
||||
if (key === 'Area (ha)') {
|
||||
td.textContent = hectares.toFixed(2);
|
||||
} else if (key === 'Area (acres)') {
|
||||
td.textContent = acres.toFixed(2);
|
||||
} else {
|
||||
td.textContent = props[key] !== undefined ? props[key] : '-';
|
||||
}
|
||||
row.appendChild(td);
|
||||
});
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue