Als je naar een pretpark gaat of camping kan je vaak een interactieve plattegrond zien. Vervolgens kan je ergens op klikken en zie je meer informatie over dat onderwerp/attractie met foto’s en tekst.

Dat wil ik ook, maar hoe maak ik dat?

Ik ben vrijwilliger bij een speeltuin, 100% vrijwilligers, en we willen een moderne plattegrond maken. Enerzijds voor ons zelf met een vlekkenplan (dat kan heel eenvoudig) om te bepalen waar wat zit en waar ruimte is voor iets anders, maar ook ‘modern’ voor op de website. Als basis hebben we de tekening van de grond en gebouwen (CAD) zodat we de toestellen een plek kunnen geven.

De website is inmiddels responsive, heeft iemand tips hoe je een plattegrond goed kan maken? Een plaatje van een plattegrond kan altijd. Maar hoe maak je dit mooi ‘interactief’ liefst zo dat het werkt op telefoon en desktop....

(Bewerkt door ScoobyDoo om 11:41, 25-01-2018)

Maar een tekening maken kan in van alles. Metname de omzetting naar het web ben ik wel benieuwd of iemand daar iets voor weet, zonder het wiel opnieuw te hoeven uitvinden.

• Natuurproducten: https://www.bestel-aloevera.nl
• Tweede inkomen: https://www.extra-geld-verdienen.info

daar gaat mijn tweede inkomen ...

toch niet! de links in mijn quote werken wel

(Bewerkt door DomP om 19:05, 25-01-2018)

Had gehoopt dat iemand misschien een interactieve plattegrond of zoiets gemaakt zou hebben. Anders beginnen we gewoon vanaf nul en komen we er ook wel. Maar vrijwilligerswerk kost altijd al genoeg tijd.

Het probleem blijkt dat het lastig is om de juiste zoekterm(en) te vinden, want zoals 'plan' als layout' worden in het Engels ook voor veel andere dingen gebruikt.

Het enige wat ik uiteindelijk kon vinden was dit: https://www.autodesk.com/products/autocad-map-3d/overview

Maar je had het zelf al over CAD, dus waarschijnlijk niets nieuws.  

On-topic: ik denk dat je idd het best af bent met een custom oplossing; je hebt in elk geval de meeste controle over het eindresultaat.

Hajonides om 10:28, 26-01-2018
Bekende MF-cms bug, geloof ik. Zal dus met de nieuwe webomgeving straks vermoedelijk ook geen rol meer spelen …

Dat klopt als een bus.

Wordt dan niet echt responsive. Misschien het geheel in een frame ofzo.

Ik zal eens in jquery duiken. Tegenwoordig zit daar al zo veel in. Maar dan wordt het inderdaad een eigen ontwikkeling  

Maar nee zoiets zal niet standaard out of the box komen omdat het veel te weinig gebruikt wordt.

Wat je kunt doen.

Maak een vector map van je plattegrond. Op het internet kun je gewoon vectors (.svg) gebruiken dus dat schaalt netjes en is meteen Retina proof.
https://medium.com/@sam__rye/a-guide-to-creating-scalable-vector-maps-92e891f0ad3e

Als je eenmaal de plattegrond hebt toegevoegd aan je site en dat werkt kun je er via HTML, CSS en JavaScript tooltips opzetten. Bolletjes waar mensen op kunnen tikken en dan komt een venstertje omhoog met meer informatie.
http://iamceege.github.io/tooltipster/#demos

(Bewerkt door Hajonides om 12:54, 26-01-2018)

Responsive Image Maps jQuery Plugin

ScoobyDoo om 13:45, 26-01-2018
https://journocode.com/2016/08/02/svg-tooltips/

We hebben deze link 'gerepareerd, en ook meteen de links in ScoobyDoo's onderschrift aangepast zodat die ook goed werken.