diff --git a/src/components/TurkHit/features.js b/src/components/TurkHit/features.js index aa8c5b830de210de979bf1cf316ea07aa5697eb5..50f62b5626f816ae802bd02f136e1d5569a14b09 100644 --- a/src/components/TurkHit/features.js +++ b/src/components/TurkHit/features.js @@ -3,7 +3,9 @@ const featuresDict = { 2: 'Window', 3: 'Building Point', 4: 'Roof Point', - + 5: 'Adjacent Building 1 Point', + 6: 'Adjacent Building 2 Point', + 7: 'Adjacent Building 3 Point', }; export default featuresDict; diff --git a/src/components/TurkHit/index.js b/src/components/TurkHit/index.js index 27abed2d3a01f147321721dee14e78a3352a9c99..76f24739d6ecbb70f96e7e5e82d1faae23e2998f 100644 --- a/src/components/TurkHit/index.js +++ b/src/components/TurkHit/index.js @@ -47,6 +47,7 @@ class TurkHit extends Component { const data = curHit.dimensions.points.reduce((acc, val) => { // Convert latitude and longitude to feet const DEG_TO_FT = 364488.888889; + const METER_TO_FT = 3.28084; const latitudeFeet = (val.latitude * DEG_TO_FT); const longitudeFeet = (val.longitude * DEG_TO_FT); if ((minLat === null) || (latitudeFeet < minLat)) { @@ -55,25 +56,39 @@ class TurkHit extends Component { if ((minLong === null) || (longitudeFeet < minLong)) { minLong = longitudeFeet; } - if ((maxFoot === null) || (val.corresponding_height > maxFoot)) { - maxFoot = val.corresponding_height; + const elevationFeet = val.elevation * METER_TO_FT; + if ((maxFoot === null) || (elevationFeet > maxFoot)) { + maxFoot = elevationFeet; } - const point = [latitudeFeet, val.corresponding_height, longitudeFeet]; + const point = [latitudeFeet, elevationFeet, longitudeFeet]; if (featuresDict[val.feature] === 'Building Point') { acc.buildingPoints.push(point); } else if (featuresDict[val.feature] === 'Roof Point') { acc.roofPoints.push(point); + } else if (featuresDict[val.feature] === 'Adjacent Building 1 Point') { + acc.adjacentBuilding1.push(point); + } else if (featuresDict[val.feature] === 'Adjacent Building 2 Point') { + acc.adjacentBuilding2.push(point); + } else if (featuresDict[val.feature] === 'Adjacent Building 3 Point') { + acc.adjacentBuilding3.push(point); } return acc; - }, { buildingPoints: [], roofPoints: [] }); + }, { + buildingPoints: [], + roofPoints: [], + adjacentBuilding1: [], + adjacentBuilding2: [], + adjacentBuilding3: [], + }); // Now clean the data we've create and add new series to support // the visualization const buildingPointColor = '#5882FA'; const roofPointColor = '#2E2E2E'; + const adjacentBuildingPointColor = '#CEC216'; const basePoints = []; // Points that will visually connect the building points // to the base points @@ -108,6 +123,54 @@ class TurkHit extends Component { basePoints.push(basePoints[0]); } + + // Do the same visual connection with the adjacent buildings + const adjacentBasePoints = []; + const adjacentBuildingBaseConnectPoints = []; + const adjacentBuildingPoints = [ + data.adjacentBuilding1, + data.adjacentBuilding2, + data.adjacentBuilding3, + ].map((adjBuilding) => { + const newAdjacentBasePoints = []; + const newAdjacentBuildingPoints = adjBuilding.map((val) => { + const newLat = val[0] - minLat; + const newLong = val[2] - minLong; + + if (newLat > maxFoot) { + maxFoot = newLat; + } + if (newLong > maxFoot) { + maxFoot = newLong; + } + const newAdjacentBuildingPoint = [newLat, val[1], newLong]; + // A point with height of 0 + const basePoint = [newLat, 0, newLong]; + // Now connect the base points and the building point + adjacentBuildingBaseConnectPoints.push({ + color: adjacentBuildingPointColor, + data: [newAdjacentBuildingPoint, basePoint], + stickyTracking: false, + enableMouseTracking: false, + }); + + newAdjacentBasePoints.push([newLat, 0, newLong]); + return [newLat, val[1], newLong]; + }); + adjacentBasePoints.push({ + color: adjacentBuildingPointColor, + data: newAdjacentBasePoints, + stickyTracking: false, + enableMouseTracking: false, + }); + return { + color: adjacentBuildingPointColor, + data: newAdjacentBuildingPoints, + stickyTracking: false, + enableMouseTracking: false, + }; + }); + const roofPoints = data.roofPoints.map((val) => { const newLat = val[0] - minLat; const newLong = val[2] - minLong; @@ -140,7 +203,6 @@ class TurkHit extends Component { const chart = new Highcharts.Chart({ chart: { renderTo: 'chart-container', - // height: '100%', margin: 100, marginLeft: 300, marginRight: 400, @@ -217,7 +279,11 @@ class TurkHit extends Component { stickyTracking: false, lineWidth: 0, }, + ...adjacentBuildingPoints, + ...adjacentBasePoints, ...buildingBaseConnectPoints, + ...adjacentBuildingBaseConnectPoints, + ], }); // We need to set state AFTER the component updates because