Forklaring
For embedding av iframe med Mazemap innhold, har vi flere l?sninger, beskrevet i Mazemap sin dokumentasjon.
Man kan bruke f?lgende snippet til emebedding:
<iframe width="100%" height="420" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://use.mazemap.com/?config=uio&utm_medium=iframe" style="border: 1px solid grey" allow="geolocation"></iframe>
Da f?r man opp det samme viewet som lenken https://use.mazemap.com/#v=1&config=uio
Fremheving av omr?de
Om dere ?nsker ? fremheve et omr?de, m? dere legge til &campusid=X i lenken. For campus Blindern ser koden slik ut:
<iframe width="100%" height="420" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://use.mazemap.com/?config=uio&campusid=797&utm_medium=iframe" style="border: 1px solid grey" allow="geolocation"></iframe>
Her finner dere campus IDer for de forskjellige campuser:
· Campus Blindern = 797
· Campus Gaustad = 799
· Campus Geitmyra = 800
· Campus Sentrum = 801
· Campus Andre Oslo
o Silurveien (AN36)= 814
o Sandakerveien 130 (AN39)= 815
Da er det bare ? sette inn de riktige IDene per omr?de.
I tillegg, hvis dere ?nsker ? ha viewer per bygg, m? dere legge til koordinatene som dere kan ta ut fra kartet og sette de inn i koden. Dette m? dere gj?re:
- ?pner kartet -> https://use.mazemap.com/#v=1&config=uio
- Juster kartvisning slik at et bygg er valgt. (f.eks. Georg Sverdrups hus)
- Kopier koordinatene fra nettsidens URL:
- Deretter settes dettee inn disse i koden, slik at snippet ser f?lgende ut:
<iframe width="100%" height="420" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://use.mazemap.com/?config=uio&campusid=797¢er=10.721605,59.939002&zoom=19.2&utm_medium=iframe" style="border: 1px solid grey" allow="geolocation"></iframe>
Linke spesifikke bygg eller rom
Man kan ogs? sette inn en rom/bygg-link inn i snippeten, slik som for rom 3420, der nettside URL'en er
https://use.mazemap.com/#v=1&zlevel=3¢er=10.716896,59.943533&zoom=20.4&sharepoitype=poi&sharepoi=1000986447&campusid=799
der snippetten blir blir
<iframe width="100%" height="420" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://use.mazemap.com/#v=1&zlevel=3¢er=10.716896,59.943533&zoom=20.4&sharepoitype=poi&sharepoi=1000986447&campusid=799&utm_medium=iframe" style="border: 1px solid grey" allow="geolocation"></iframe>
og ser ut som;
Flere eksempler
Div tester av iframe embedding, med kildekode under
F?rst en variasjon til av den over, der iframet har st?rre h?yde og viewet er zoomet litt ut
Map by MazeMap
<iframe width="600" height="420" frameBorder="0" scrolling="no" marginHeight="0" marginWidth="0" src="https://use.mazemap.com/embed.html#v=1&config=uio¢er=10.721570,59.938944&zoom=17.9&zlevel=1&campusid=797&sharepoitype=poi&sharepoi=1000948888&utm_medium=iframe" style={{ border: '1px solid grey' }} allow="geolocation"></iframe><br/><small><a href="https://www.mazemap.com/">Map by MazeMap</a></small>
Den kunne nok trengt litt mer h?yde og zoomet litt ut
Map by MazeMap
<iframe width="600" height="800" frameBorder="0" scrolling="no" marginHeight="0" marginWidth="0" src="https://use.mazemap.com/embed.html#v=1&config=uio¢er=10.721570,59.938944&zoom=17&zlevel=1&campusid=797&sharepoitype=poi&sharepoi=1000948888&utm_medium=iframe" style={{ border: '1px solid grey' }} allow="geolocation"></iframe><br/><small><a href="https://www.mazemap.com/">Map by MazeMap</a></small>