iFrame en Kaartprikker functionaliteit

Ik heb de wizard op kaart.pdok.nl doorlopen en heb een heel simpel kaartje gemaakt, waarmee je de XY-coördinaten te zien krijgt waar ik heb geklikt op de kaart (de Kaartprikker functionaliteit).

Hieronder heb ik even de code geplakt, die wel werkte. Je ziet dus een kaartje en de XY-coördinaten komen in de twee velden te staan. Ik wil hetzelfde doen, maar dan met iFrame. Ik kreeg dat niet voor elkaar. Is er misschien iemand die dat wel al zo heeft gebruikt?

Laurens

<html>
	<head>
		Paste hier de head code uit de Wizard
	</head>
	<body>
		<form>
			Klik in de kaart om een locatie op te slaan.<BR>
			X-coordinaat in RD: <input id="x" name="x" type="text" />
			Y-coordinaat in RD: <input id="y" name="y" type="text" />
		</form>

<script type="text/javascript" src="http://kaart.pdok.nl/api/js/OpenLayers.js"></script>
<script type="text/javascript" src="http://kaart.pdok.nl/api/js/proj4js-compressed.js"></script>
<script type="text/javascript" src="http://kaart.pdok.nl/api/js/pdok-api.js"></script>
<script type="text/javascript" src="http://kaart.pdok.nl/api/js/geozetlib.js"></script>
<script type="text/javascript" src="http://kaart.pdok.nl/api/js/pdok-markers.js"></script>
<script type="text/javascript" src="http://kaart.pdok.nl/api/js/pdok-layers.js"></script>
<script type="text/javascript">
Pdok.addcss("http://kaart.pdok.nl/api/styles/default/style.css");
Pdok.addcss("http://kaart.pdok.nl/api/styles/api.css");
var config_145={
  "mapdiv": "map_145",
  "zoom": 3,
  "loc": "170000, 470000",
  "baselayers": [
	{
	  "id": "BRT",
	  "visible": true
	},
	{
	  "id": "LUFO",
	  "visible": false
	}
  ],
  "locationtool": true,
  "locationtoolstyle": "mt0",
  "locationtoolxfield": "x",
  "locationtoolyfield": "y",
  "locationtoolurlfield": "url",
  "locationtoolzmin": 2,
  "locationtoolzmax": 14,
  "markersdef": "http://kaart.pdok.nl/api/js/pdok-markers.js",
  "layersdef": "http://kaart.pdok.nl/api/js/pdok-layers.js"
};
var api_145;
Pdok.ready( 
function(){ 
api_145 = new Pdok.Api(config_145);
} );
</script>
<div id="map_145" class="olMap small"></div>

	</body>
</html>

Kun je bovenstaande pagina niet in haar geheel als iFrame aanroepen? M.a.w. sla bovenstaande op als bijv. kaartprikker.html, upload het naar een server en roep het in pagina waar je het wilt hebben aan als

<iframe src="http://pad.naar.je.server/kaartprikker.html"></iframe>

Of wil je de velden vanuit een iFrame vullen? Dat kan volgens mij niet omdat JavaScript niet bij elementen buiten de iFrame waarin het uitgevoerd wordt kan komen.

@laurenskusse Is het gelukt :question:

Mijn collega is ermee aan de slag gegaan en hij heeft er voor gekozen om er een soort popup van te maken.
Volgens mij heeft hij geen gebruik gemaakt van iframe.

Hopelijk kan ik binnen een paar weken een link hier plaatsen naar de site die we hebben gemaakt. De site is nu klaar en wordt intern getest.

Via de site kunnen vragen over bouw- en woningtoezicht worden ingediend. Op de eerste pagina moeten de eigen contactgegevens worden opgegeven en op de tweede pagina kan men de vraag stellen. Daarbij moet men aangeven waar de vraag betrekking op heeft: eigen adres (dan wordt een kopie gemaakt van de eerste pagina), ander adres, kadastraal perceel of een plek in de openbare ruimte. Als voor het laatste wordt gekozen, verschijnt een linkje waarmee de PDOK-kaart met kaartprikker wordt geopend.

In ieder geval bedankt voor de hulp! En ik zal later hier terugkomen met de link naar de site als deze van buitenaf bereikbaar is gemaakt.

Groeten,
Laurens

1 like

Oud collega ook proef implementaties gedaan met de kaartprikker, wellicht kun je wat hergebruiken:

  1. PDOK Kaartprikker contour in webform (via MySQL) met head/body en externe WMS (Wbb-vlakken)
    Klein Kranenburg � Herkomst en verspreiding van de familienaam

  2. Kaartprikker (codes van www.duif.net/pdokkaart)
    Klein Kranenburg � Herkomst en verspreiding van de familienaam

zie ook test site
http://kleinkranenburg.nl/jan/pdokkaart/

1 like

We hebben de website met de PDOK-kaartprikker nu live gezet: http://meldingbwt.odmh.nl/.

De site is bedoeld voor personen die bouw- en woningtoezicht gerelateerde vragen willen stellen aan de omgevinsdienst.
Als je het leuk vindt om te testen, dan kan je op de eerste pagina onzin invullen en op de tweede pagina kan je aangeven over welke locatie de vraag gaat. Daar zit de optie “aanwijzen openbaar gebied” en dan kom je bij PDOK-kaartprikker.

Wanneer de melding is ingediend, komen alle gegevens in een database. Van de PDOK-kaartprikker worden de X- en Y-coördinaat geregistreerd. De melding wordt intern bekeken en mijn collega’s kunnen er dan voor kiezen om een zaak aan te maken of de vraag direct te beantwoorden. Wanneer een zaak wordt aangemaakt, wordt met Python een XML gemaakt, die naar de webservice van ons zaaksysteem wordt gestuurd, zodat daar een zaak wordt aangemaakt.

De XY-coördinaten worden nu alleen nog als tekst bij de zaak geregistreerd. Ik ga later nog bekijken of we hier iets slims mee kunnen doen, zodat de zaak op de kaart zichtbaar wordt ter plaatse van die XY-coördinaten. Ik zou bijvoorbeeld ook een kadastraal perceel kunnen ophalen met die XY-coördinaten en dan een kadastraal perceel bij de zaak kunnen registreren. Maar dit ga ik later nog eens bekijken. Eerst maar eens zien of het gebruikt wordt!

Bedankt voor de hulp en de voorbeelden!

1 like