config.json

{
  "mapcontainer": "vcs_map_container",
  "locale": "en",
  "availableLocales": [
    "de",
    "en"
  ],
  "startViewPoint": "startview",
  "projection": {
    "epsg": 31463,
    "proj4": "+proj=tmerc +lat_0=0 +lon_0=9 +k=1 +x_0=3500000 +y_0=0 +ellps=bessel +datum=potsdam +units=m +no_defs"
  },
  "ui": {
    "startRoute": null,
    "content": {
      "show": true,
      "iframe": {
        "contentPosition": "center",
        "contentPositionFixed": false,
        "show": true
      },
      "legend": {
        "contentPosition": "left",
        "contentPositionFixed": false,
        "show": true
      }
    },
    "search": {
      "activeOnStartup": false
    },
    "toolbox": {
      "show": true,
      "homeButton": {
        "show": true
      },
      "mapButtons": {
        "show": true
      },
      "widgetButtons": {
        "show": true
      },
      "overviewMap": {
        "show": true
      }
    },
    "metaLinks": {
      "links": [
        {
          "url": {
            "de": "templates/de/impressum.html",
            "en": "templates/en/impressum.html"
          },
          "title": {
            "de": "Impressum",
            "en": "Imprint"
          },
          "target": "iframe"
        },
        {
          "url": {
            "de": "templates/de/datenschutzhinweise.html",
            "en": "templates/en/datenschutzhinweise.html"
          },
          "title": {
            "de": "Datenschutz",
            "en": "Privacy"
          },
          "target": "iframe"
        }
      ]
    },
    "mapControls": {
      "show": true,
      "Navigation": {
        "show": true
      },
      "Shadow": {
        "show": true
      }
    },
    "footer": {
      "logoBox": {
        "show": true,
        "text": null
      },
      "show": true
    },
    "header": {
      "headerButtons": {
        "show": true,
        "help": true
      },
      "show": true,
      "logoBox": null,
      "title": "M4_Lab Plattform"
    }
  },
  "selectBehavior": {
    "highlightStyle": {
      "selectionset": {
        "color": "rgb(63, 81, 181)"
      },
      "currentItem": {
        "color": "rgb(244, 67, 54)",
        "pointStyle": {
          "icon": {
            "scale": 1,
            "src": "{layerIcon}"
          }
        },
        "lineStyle": {
          "color": "rgb(131, 245, 44)",
          "width": 1.25
        },
        "polygonStyle": {
          "fill": {
            "color": "rgba(255, 255, 255, 0.4)"
          },
          "stroke": {
            "color": "rgb(131, 245, 44)",
            "width": "1"
          }
        }
      }
    }
  },
  "maps": [
    {
      "name": "Cesium Map",
      "startingmap": true,
      "type": "vcs.vcm.maps.Cesium",
      "webGLaa": false
    },
    {
      "name": "Openlayers Map",
      "startingmap": false,
      "type": "vcs.vcm.maps.Openlayers"
    }
  ],
  "widgets": [
    {
      "type": "vcs.vcm.widgets.AdvancedWalkMode",
      "name": "Advanced walkmode"
    },
    {
      "type": "vcs.vcm.widgets.BalloonInfo",
      "name": "Balloon Info",
      "balloonTypes": [{"template": ["<div class='balloon' onclick='testshow()' id='myBalloon'>","   <h1 class='balloon-title'>'Test'</h1>","   <div class='balloon-content' style='height:290px; margin-right: 0px;'","   </div>","<p class='balloon-text'><span><a href='https://www.google.com/search?rlz=1C1CHBF_enDE811DE811&sxsrf=ALeKk01gRMo1LE6p2j5dnHH-eZa1E2I_TA%3A1604050697035&ei=Cd-bX7fRAY62Us68iYAC&q=test&oq=test&gs_lcp=CgZwc3ktYWIQAzIECCMQJzIECCMQJzIGCCMQJxATMgcIABCxAxBDMgQIABBDMgQIABBDMgIIADIFCAAQsQMyBQgAELEDMgcIABAUEIcCOgcIABBHELADUKEvWKEvYP4vaABwAHgAgAFLiAGHAZIBATKYAQCgAQGqAQdnd3Mtd2l6yAEIwAEB&sclient=psy-ab&ved=0ahUKEwj3-f2_gtzsAhUOmxQKHU5eAiAQ4dUDCA0&uact=5' target='_blank'q>link text</a>This is a test</span><br></p>",
      "<iframe src='https://www.steg.de/' ></iframe>",
      "</div>","<%  %>"],"minTop": "balloonHeight + 10","minLeft": "70","layerTypes": [""],"layerNames": ["100005"]},
        {"template": ["<div class='balloon' onclick='testshow()' id='myBalloon'>","   <h1 class='balloon-title'>'Test'</h1>","   <div class='balloon-content' style='height:290px; margin-right: 0px;'","   </div>","<p class='balloon-text'><span>This is a test</span><br></p>", "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/Umfrage.jpg' alt='Simply Easy Learning' width='370'>","</div>","<%  %>"],"minTop": "balloonHeight","minLeft": "60","layerTypes": [""],"layerNames": ["100004"]},
        {"template": [
          "<div class='balloon' onclick='testshow()' id='myBalloon'>",
          "   <h1 class='balloon-title'>Test</h1>",
          "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
          "   </div>","<p class='balloon-text'><span>Das hier ist ein Test Ballon. Er wurde von einem User erstellt.</span><br></p>",
          "</div>","<%  %>"
          ],
          "minTop": "balloonHeight",
          "minLeft": "70",
          "layerTypes": [""],
          "layerNames": ["100002"]
        },
        {"template": [
          "<div class='balloon' onclick='WeilimdorfAreaText()' id='myBalloon'>",
          "   <h1 class='balloon-title'>Gebiet Nummer 1</h1>",
          "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
          "   </div>","<p class='balloon-text'><span>Das hier ist ein Test Ballon. Es zeigt den Ballon zum Gebiet Nummer 1</span><br></p>",
          "</div>","<%  %>"
          ],
          "minTop": "balloonHeight",
          "minLeft": "70",
          "layerTypes": [""],
          "layerNames": ["AreaOne"]
        },
        {"template": [
          "<div class='balloon' onclick='WeilimdorfAreaText()' id='myBalloon'>",
          "   <h1 class='balloon-title'>Gebiet Nummer 3</h1>",
          "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
          "   </div>","<p class='balloon-text'><span>Das hier ist ein Test Ballon. Es zeigt den Ballon zum Gebiet Nummer 3</span><br></p>",
          "</div>","<%  %>"
          ],
          "minTop": "balloonHeight",
          "minLeft": "70",
          "layerTypes": [""],
          "layerNames": ["AreaThree"]
        },

        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "   <h1 class='balloon-title'><%= obj.title %></h1>",
            "   <div class='balloon-content'>",
            "       <%= obj.description %>",
            "   </div>",
            "   <div class='balloon-close-col'>",
            "       <button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "   </div>",
            "   <div class='dialog-image-balloon'></div>",
            "   <div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "minTop": "balloonHeight + 70",
          "minLeft": "70",
          "layerNames": [],
          "layerTypes": [
            "vcs.vcm.layer.Vector"
          ]
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "   <h1 class='balloon-title'><%= obj.name %></h1>",
            "   <div class='balloon-content'>",
            "       <%= obj.description %>",
            "   </div>",
            "   <div class='balloon-close-col'>",
            "       <button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "   </div>",
            "   <div class='dialog-image-balloon'></div>",
            "   <div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "minTop": "balloonHeight + 70",
          "minLeft": "70",
          "layerNames": [],
          "layerTypes": [
            "vcs.vcm.layer.cesium.Gltf"
          ]
        },
        {
          "comment": "Default Balloon for Planning Vector Layers",
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "</div>",
            "<div class='balloon-close-col'><button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div><div class='dialog-image-balloon'></div><div class='balloon-left-edge'></div></div>"
          ],
          "minTop": "balloonHeight + 70",
          "minLeft": "70",
          "layerNames": [],
          "layerTypes": [
            "vcs.vcm.layer.FeatureStore"
          ],
          "allAvailable": false,
          "properties": [],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "Böckingerstrasse"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "Rosenstein"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [
            {
              "title": "creationDate",
              "name": "creationDate"
            },
            {
              "title": "gml:name",
              "name": "gml:name"
            }
          ],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "StuttgartLocal1"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [
            {
              "title": "creationDate",
              "name": "creationDate"
            },
            {
              "title": "gml:name",
              "name": "gml:name"
            }
          ],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "StuttgartPart"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [
            {
              "title": "creationDate",
              "name": "creationDate"
            },
            {
              "title": "gml:name",
              "name": "gml:name"
            }
          ],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "Stöckach"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [
            {
              "title": "creationDate",
              "name": "creationDate"
            },
            {
              "title": "gml:name",
              "name": "gml:name"
            }
          ],
          "balloonHeader": "Balloon header"
        },
        {
          "template": [
            "<div class='balloon' onclick='Questionnaire();' id='myBalloonP1'>",
            "   <h1 class='balloon-title'>Umfrage (Böckinger Straße)</h1>",
            "   <div class='balloon-content' style='height:250px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>Um die Umfrage zu starten klicken Sie bitte hier!</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/Umfrage.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% openquestionaire() %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "Questionnaire"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='Questionnaire(\"1\");' id='myBalloonP1'>",
            "   <h1 class='balloon-title'>Umfrage (Weilimdorf) Part 1</h1>",
            "   <div class='balloon-content' style='height:250px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>Um die Umfrage zu starten klicken Sie bitte hier!</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/Umfrage.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>"

          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "ProjektNord"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='Questionnaire(\"2\");' id='myBalloonP1'>",
            "   <h1 class='balloon-title'>Umfrage (Weilimdorf) Part 2</h1>",
            "   <div class='balloon-content' style='height:250px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>Um die Umfrage zu starten klicken Sie bitte hier!</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/Umfrage.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>"

          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "Questionnaire02"
          ]
        },
        {"template": [
          "<div class='balloon' onclick='Questionnaire(\"3\")' id='myBalloon'>",
          "   <h1 class='balloon-title'>Online Befragung</h1>",
          "   <div class='balloon-content' style='height:260px; margin-right: 0px;'",
          "   </div>",
          "<p class='balloon-text'><span>Was sind Ihre Vorstellungen?</span><br></p>", 
          "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/Umfrage.jpg' alt='Simply Easy Learning' width='375'>",
          "</div>",
          "<%  %>",
          "<%  %>"
        ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": ["MK_allgUmfrage"]
        },
        {
          "template": [
            "<div class='balloon' onclick='showbereich(\"A\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bereich A</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier geht es um Bereich A</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station2_gartenkiosk.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_bereichA",
            "AreaFour"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Grüner Korridor</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zum grünen Korridor</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_ehem.Walz Gärtnerei_vorläufig.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Korridor"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showbereich(\"jugendhaus\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Jugendhaus</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zum Jugendhaus</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Jugendhaus.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Jugendhaus"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showbereich(\"walz\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Areal der ehem. Gärtnerei Walz</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zu der ehem. Gärtnerei Walz</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_ehem.Walz Gärtnerei_vorläufig.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Walz"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Haltestelle U13</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zur U13</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_U13.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_U13"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Aktuelle Gebäudenutzung</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zu der aktuellen Gebäudenutzung</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Sportangebot.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Gebaeudenutzung"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bestehende Sportfelder</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zu den bestehenden Sportfeldern</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Sportangebot.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Sportfelder"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showbereich(\"burgerhaus\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bürgerhaus</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zum Bürgerhaus</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Flüchtlingsunterkunft.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Buergerhaus"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showbereich(\"fluchtling\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Flüchtlingsunterkunft</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zur Flüchtlingsunterkunft</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Flüchtlingsunterkunft.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Fluechtling"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Jugendhaus Multiplikator</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier stehen Infos zum Jugendhaus</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Jugendhaus.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Jugendhaus_multi"
          ]
        },{
          "template": [
            "<div class='balloon' onclick='showbereich(\"kindertag\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Spatzennest</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier geht es um das Spatzennest</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Info_Spatzennest.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_Spatzennest"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showbereich(\"B\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bereich B</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier geht es um Bereich B</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station2_gartenkiosk.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_bereichB",
            "AreaThree"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showbereich(\"C\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bereich C</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier geht es um Bereich C</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Bereich_C.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_bereichC",
            "AreaOne"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showbereich(\"D\")' id='myBalloon'>",
            "   <h1 class='balloon-title'>Bereich D</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier geht es um Bereich D</span><br></p>",
            "<img style='padding-top:10px' src='images/MK_Images/Bereich_D.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "MK_bereichD",
            "AreaTwo"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='WeilimdorfAreaText()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Station 2</h1>",
            "   <div class='balloon-content' style='height:310px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier wurde eine Gartenkiosk errichtet.</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station2_gartenkiosk.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "LocationTwo"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Station 1</h1>",
            "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier wurde eine Spielekiosk errichtet.</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station1_spielekiosk.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% openquestionaire() %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "LocationOne"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Station 3</h1>",
            "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier wurde eine Outdoorkiosk errichtet.</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station3_outdoorkiosk1.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% openquestionaire() %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "LocationThree"
          ]
        },
        {
          "template": [
            "<div class='balloon' onclick='showtourSpecific()' id='myBalloon'>",
            "   <h1 class='balloon-title'>Station 4</h1>",
            "   <div class='balloon-content' style='height:290px; margin-right: 0px;'",
            "   </div>",
            "<p class='balloon-text'><span>hier wurde eine Infokiosk errichtet.</span><br></p>",
            "<img style='padding-top:10px' src='images/content/contentboeckingerstrasse/station4_Infokiosk.jpg' alt='Simply Easy Learning' width='375'>",

            "</div>",
            "<%  %>",
            "<% openquestionaire() %>"
          ],
          "minTop": "balloonHeight + 10",
          "minLeft": "70",
          "layerTypes": [
            ""
          ],
          "layerNames": [
            "LocationFour"
          ]
        },
        {
          "template": [
            "<div class='balloon' id='myBalloon'>",
            "<div class='balloon-content'>",
            "<h1 class='balloon-title'>Balloon header</h1>",
            "<% for (var key in obj) { %>",
            "<% if (obj[key] instanceof Object){%>",
            "<% for (var key2 in obj[key]) { %>",
            "<p class='balloon-text'><span class='balloon-street'> <strong> <%=key%>.<%=key2%> </strong> : <%=obj[key][key2]%></span><br></p>",
            "<% } %>",
            "<% } else{ %>",
            "<p class='balloon-text'>",
            "<span class='balloon-street'> <strong> <%=key%> </strong> : <%=obj[key]%></span><br>",
            "</p>",
            "<% } %>",
            "<% } %>",
            "</div>",
            "<div class='balloon-close-col'>",
            "<button class='close-balloon'><i class='fa fa-times fa-lg'></i></button>",
            "</div>",
            "<div class='dialog-image-balloon'></div>",
            "<div class='balloon-left-edge'></div>",
            "</div>"
          ],
          "layerTypes": [
            null
          ],
          "layerNames": [
            "StuttgartLocal"
          ],
          "minTop": "balloonHeight + 30",
          "minLeft": "70",
          "allAvailable": true,
          "properties": [
            {
              "title": "DatenquelleDachhoehe",
              "name": "DatenquelleDachhoehe",
              "active": true
            },
            {
              "title": "Gemeindeschluessel",
              "name": "Gemeindeschluessel",
              "active": true
            },
            {
              "title": "DatenquelleLage",
              "name": "DatenquelleLage",
              "active": true
            },
            {
              "title": "DatenquelleBodenhoehe",
              "name": "DatenquelleBodenhoehe",
              "active": true
            },
            {
              "title": "roofType",
              "name": "roofType",
              "active": true
            },
            {