Merged PR 2451: included dynamic legend on enlarged map

included dynamic legend on enlarged map

Related work items: #23879
This commit is contained in:
Robert Bond
2026-07-02 16:12:23 +00:00
parent e864049bec
commit 79e6dfade9
2 changed files with 13 additions and 80 deletions
+12 -79
View File
@@ -68,86 +68,9 @@ const DNSSearchResults = (props) => {
const [showSpinnerState, setShowSpinnerState] = useState(false);
const [isMapExpanded, setIsMapExpanded] = useState(false);
// let dataArray = [];
// //push your Json Data in the array
// if (showMap == "true") {
// dnsCoords.map((item) => {
// let point = new OSPoint(
// item.pinswg_anticipatedgridrefnorthing ||
// item.pinswg_anticipatedgridreferencenorthingtext ||
// 0,
// item.pinswg_anticipatedgridrefeasting ||
// item.pinswg_anticipatedgridreferenceeastingtext ||
// 0
// );
// let siteCoords = point.toOSGB36();
// //console.log(siteCoords);
// //console.log(item);
// dataArray.push({
// appellant:
// item[
// "_pinswg_appellant_value@OData.Community.Display.V1.FormattedValue"
// ],
// name: item.pinswg_projectname,
// lat: parseFloat(siteCoords.latitude),
// lng: parseFloat(siteCoords.longitude),
// title: item.pinswg_name,
// });
// });
// }
const mapLegend = mapTarget.replaceAll("-", "_");
//console.log(dataArray);
// const ModelsMap = (map, maps) => {
// //instantiate array that will hold your Json Data
// //console.log("here");
// var prev_infowindow = false;
// //Loop through the dataArray to create a marker per data using the coordinates in the json
// console.log(dataArray.length);
// for (let i = 0; i < dataArray.length; i++) {
// const infowindow = new google.maps.InfoWindow({
// content:
// "<div>" +
// (_.isEmpty(dataArray[i].name)
// ? ""
// : dataArray[i].name.indexOf(";") > 0
// ? router.locale == "cy"
// ? dataArray[i].name.split(";")[1]
// : dataArray[i].name.split(";")[0]
// : dataArray[i].name) +
// "</div>" +
// (dataArray[i].appellant != null
// ? "<div>" + dataArray[i].appellant + "</div>"
// : "") +
// "<div>" +
// dataArray[i].title +
// "</div>",
// });
// let marker = new maps.Marker({
// position: { lat: dataArray[i].lat, lng: dataArray[i].lng },
// title: _.isEmpty(dataArray[i].name)
// ? ""
// : dataArray[i].name.indexOf(";") > 0
// ? router.locale == "cy"
// ? dataArray[i].name.split(";")[1]
// : dataArray[i].name.split(";")[0]
// : dataArray[i].name,
// map,
// });
// marker.addListener("click", () => {
// if (prev_infowindow) {
// prev_infowindow.close();
// }
// prev_infowindow = infowindow;
// infowindow.open({
// anchor: marker,
// map,
// shouldFocus: true,
// });
// });
// }
// };
console.log(mapLegend);
let spinnerState = () => {
showSpinnerState == true
@@ -972,6 +895,16 @@ const DNSSearchResults = (props) => {
</p>
</div>
{showMap == "true" && isMapExpanded && (
<div>
<h3>Map Legend</h3>
<img
src={`https://datamap.gov.wales/geoserver/ows?service=WMS&request=GetLegendGraphic&format=image/png&height=12&width=12&layer=geonode:${mapLegend}&style=&version=1.3.0&SLD_VERSION=1.1.0&LEGEND_OPTIONS=forceLabels:on&LANGUAGE=${locale}&SCALE=2000000&access_token=n3cRovjblNL1ND9bmzu6S9fupzg3wo`}
width="120%"
/>
</div>
)}
{showMap == "true" && !isMapExpanded && (
<div className="govuk-grid-column-one-half">
<div className="map-container">
+1 -1
View File
@@ -9,7 +9,7 @@ export function middleware(request) {
process.env.NODE_ENV === "production" ? "" : `'unsafe-eval'`
};
style-src 'self' 'unsafe-eval' 'unsafe-inline';
img-src 'self' 'unsafe-inline' https://www.gov.wales https://gov.wales https://fonts.gstatic.com https://www.googletagmanager.com blob: data: https://img.youtube.com;
img-src 'self' 'unsafe-inline' https://datamap.gov.wales/ https://www.gov.wales https://gov.wales https://fonts.gstatic.com https://www.googletagmanager.com blob: data: https://img.youtube.com;
connect-src 'self' http://127.0.0.1 https://uksouth-1.in.applicationinsights.azure.com https://ukwest-0.in.applicationinsights.azure.com https://js.monitor.azure.com https://region1.google-analytics.com;
font-src 'self' https://pro.fontawesome.com/ https://fonts.gstatic.com/ ;
object-src 'none';