<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
  <meta name="description" content="">
  <title>UGL Website</title>
  <meta charset="utf-8">
  <meta name="generator" content="GitLab Pages">
  <link rel="stylesheet" href="./css/bootstrap.min.css">
  <!-- <link rel="stylesheet" href="./css/theme.min.css"> -->
  <link href="css/main.css" rel="stylesheet">
  <link href="css/custom.css" rel="stylesheet">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/xlsx/0.15.3/xlsx.full.min.js"></script>
  <script src="https://kit.fontawesome.com/79b3e255a2.js" crossorigin="anonymous"></script>
  <link rel="shortcut icon" type="image/png" sizes="32x32" href="./imgs/icon.png">

</head>

<body id="document-body">
  <!-- <div id="topbar">
        <div id="menu" class="navbar"></div>
    </div> -->

  <!-- <h1 id='projectname'></h1> Projektname kommt aus settings.js, hier nichts einfügen -->

  <!-- ÄNDERUNGEN NUR NACH DIESER ZEILE -->

  <header>
    <div class="collapse navbar-light fixed-top" id="navbarHeader">
      <div class="container">
        <div class="row">
          <div class="col-sm-8 col-md-7 py-4">
            <h4 id="rgc_about" class="text-white">About</h4>
            <p id="rgc_group" class="text-white">Details about our group to be inserted here... </p>
          </div>
          <div class="col-sm-4 offset-md-1 py-4">
            <h4 id="rgc_contact" class="text-white">Contact</h4>
            <ul class="list-unstyled">
              <!-- <li><a href="#" class="text-white">Follow on Twitter</a></li> -->
              <!-- <li><a href="#" class="text-white">Like on Facebook</a></li> -->
              <li><a href="mailto:sven.schneider[at]hft-stuttgart.de">Email me</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>
    <div class="navbar navbar-light shadow-sm" style="background-color: #ffffff;">
      <div class="container d-flex justify-content-between">
        <img src="imgs/hft.jpg" class="hftlogo" width="100px" >
        <select id="selectpicker1" class="selectpicker" data-img-src="imgs/flags/226-united-states.png"
          style="background-color: #ffffff; width: 10em; border-color:#cc3125;" data-width="fit">
          <option value='1' class="selectlang" data-img-src="imgs/flags/226-united-states.png"
            style="background-color: white;">English</option>
          <option value='2' class="selectlang" data-img-src="imgs/flags/226-united-states.png"
            style="background-color: white;">Deutsch</option>
        </select>
      </div>
    </div>
  </header>

  <main role="main">

    <section class="jumbotron text-center hftBackground">
      <div class="container">
        <img src="imgs/database.svg" class="windSVG" width="100px" alt="wind">
        <h1> <b>Urban Geoinformatics Lab </b> <br>@HFT Stuttgart </h1>
        <!-- <p id="rgc_introduction" class="lead text-muted"> (or Vote for new group name) <br>A research group introduction
          here ....</p> -->
        <p id="rgc_introduction2">The research projects at HFT Stuttgart (University of Applied Sciences Stuttgart).</p>
      </div>
    </section>

    <!-- <div class="container col-xxl-8 px-4 py-5">
      <div class="row flex-lg-row-reverse align-items-center g-5 py-5">
        <div class="col-10 col-sm-8 col-lg-6">
          <img src="img/Mutani_2018_10.JPG" class="d-block mx-lg-auto img-fluid" alt="Bootstrap Themes" width="700" height="500" loading="lazy">
        </div>
        <div class="col-lg-6">
          <h1 class="display-5 fw-bold lh-1 mb-3">Responsive left-aligned hero with image</h1>
          <p class="lead">Quickly design and customize responsive mobile-first sites with Bootstrap, the world’s most popular front-end open source toolkit, featuring Sass variables and mixins, responsive grid system, extensive prebuilt components, and powerful JavaScript plugins.</p>
          <div class="d-grid gap-2 d-md-flex justify-content-md-start">
            <button type="button" class="btn btn-primary btn-lg px-4 me-md-2">Primary</button>
            <button type="button" class="btn btn-outline-secondary btn-lg px-4">Default</button>
          </div>
        </div>
      </div>
    </div> -->
    
    <div id="cont_proto" class="cont_proto">
      <div id="album_one" class="album py-5 bg-light topDownPadding">
        <div class="container">
          <div>
            <h2 id="rgc_application"><i class="fas fa-laptop-code"></i></h2>


            </div>
            <p id="rgc_applicationdesc" class="grey-text w-responsive mx-auto mb-5" style="margin-bottom: 0.5em !important;">Research Short Introduction ....</p>
            </div>
            <!-- Searchbar -->
            <div class="container" style="height:70px;">
            <div class="search-wrapper w-responsive mx-auto mb-5">
              <div class="input-holder">
                <input type="text" id="search-input" class="search-input" placeholder="Type to search" />
                <button id="search-button" class="search-icon" onclick="searchToggle(this, event);"><span></span></button>
              </div>
              <span class="close" onclick="searchToggle(this, event);"></span>
            </div>
          </div>
            <!-- start -->

            <!-- end -->
          
          
          <!-- <br> -->
          <div class="container">
          <div id="row_main" class="row">

          </div>
        </div>
      </div>


      <!-- Zeile 3 mit Album  -->


    </div>
    <!-- <br>
      <div class="d-flex justify-content-between align-items-center btnGroupDiv">
      <div class="btn-group">
        <form action="/debug" class="form-signin" method="GET">
          <button type="submit" class="btn btn-sm btn-outline-secondary ">DEBUG</button>
        </form>
      </div>
      </div> -->
    <hr>
    <div class="container">
      
        <div>
          <h2 id="rgc_publication"><i class="fas fa-book"></i> Publications</h2></div>
          <p id="rgc_publicationdesc" class="grey-text w-responsive mx-auto mb-5" style="margin-bottom: 0.5em !important;">Research Short Introduction ....</p>

    
        <!-- <div class="col-md-5"></div> -->

      <!-- <li> Silberer, J., Santhanavanich, T., Müller, P., & Bäumer, T. (2020). 
          Promoting Objective and Subjective Safety for Cyclists in Metropolitan Areas. In Innovations for Metropolitan Areas (pp. 273–284). Springer
          Berlin Heidelberg. https://doi.org/10.1007/978-3-662-60806-7_21 
        </li> -->
      <!-- <h5>2020</h5>
      <li>
        Santhanavanich, T., Wuerstle, P., Silberer, J., Loidl, V., Rodrigues, P., and Coors, V.:
        <a href="https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020 ">3D SAFE ROUTING NAVIGATION APPLICATION FOR
          PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS</a>, ISPRS Ann. Photogramm. Remote Sens. Spatial Inf.
        Sci., VI-4/W2-2020, 143–147, https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020 
      </li>
      <li>
        Schneider, S., Santhanavanich, T., Koukofikis, A., and Coors, V.:
        <a href="https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-157-2020 ">EXPLORING SCHEMES FOR VISUALIZING URBAN
          WIND FIELDS BASED ON CFD SIMULATIONS BY EMPLOYING OGC STANDARDS</a>, ISPRS Ann. Photogramm. Remote Sens.
        Spatial Inf. Sci., VI-4/W2-2020, 157–163, https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-157-2020 
      </li>
      <li>...</li>
      <br>
      <h5>2019</h5>
      <li>...</li> -->

    </div>
    <div class="container" style="height:70px;">
      <div class="search-wrapper">
        <div class="input-holder">
          <input type="text" id="search-input_paper" class="search-input" placeholder="Type to search" />
          <button id="search-button_paper" class="search-icon" onclick="searchToggle_paper(this, event);"><span></span></button>
        </div>
        <span class="close" onclick="searchToggle_paper(this, event);"></span>
      </div>
    </div>
    <div class="container" id="cont_paper">
      <!-- <div class="card" style="max-width: 1080px;">
        <div class="row">
          <div class="col-md-3">
            <img src="imgs/publication/3droute.jpg" alt="..." style="width:100%">
          </div>
          <div class="col-md-9">
            <div class="card-body">
              <p class="card-text">Santhanavanich, T., Wuerstle, P., Silberer, J., Loidl, V., Rodrigues, P., and Coors,
                V.</p>
              <h5 class="card-title">3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN
                SOURCE TOOLS </h5>
              <span class="badge bg-primary">CityGML</span>
              <span class="badge bg-secondary">SensorThings API</span>
              <span class="badge bg-success">Open Geospatial Consortium</span>
              <span class="badge bg-danger">pgRouting</span>
              <p class="card-text"><small class="text-muted"> ISPRS Ann. Photogramm. Remote Sens. Spatial Inf. Sci.,
                  VI-4/W2-2020, 143–147, https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020</small> 

              </p>
            </div>
          </div>
        </div>
      </div> -->

      <!-- <div class="card" style="max-width: 1080px;">
        <div class="row">
          
          <div class="col-md-9">
            <div class="card-body">
              <p class="card-text">Santhanavanich, T., Wuerstle, P., Silberer, J., Loidl, V., Rodrigues, P., and Coors,
                V.</p>
              <h5 class="card-title">3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN
                SOURCE TOOLS </h5>
              <span class="badge badge-pill badge-info">CityGML</span>
              <span class="badge badge-pill badge-info">SensorThings API</span>
              <span class="badge badge-pill badge-info">Open Geospatial Consortium</span>
              <span class="badge badge-pill badge-info">pgRouting</span>
              <span class="badge badge-pill badge-info">Warning</span>
              <p class="card-text"><small class="text-muted"> ISPRS Ann. Photogramm. Remote Sens. Spatial Inf. Sci.,
                  VI-4/W2-2020, 143–147, https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020</small> 

              </p>
            </div>
          </div>
          <div class="col-md-3">
              <img src="imgs/publication/3droute.jpg" alt="..." style="width:100%">
          </div>
        </div>
      </div> -->
      <div class="card" style="max-width: 1080px;">
        <div class="row">
          <div class="col-md-3">
            <img src="imgs/publication/3droute.jpg" alt="..." style="width:100%">
          </div>
          <div class="col-md-9">
            <div class="card-body">
              <h5 class="card-title" style="margin-bottom:0px">
                <small>Santhanavanich, T., Wuerstle, P., Silberer, J., Loidl, V., Rodrigues, P., and Coors, V.</small>
                <br>
                3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS
                <br>
                <small>
                    <span class="badge badge-pill badge-light">CityGML</span>
                    <span class="badge badge-pill badge-light">SensorThings API</span>
                    <span class="badge badge-pill badge-light">Open Geospatial Consortium</span>
                    <span class="badge badge-pill badge-light">pgRouting</span>
                    <span class="badge badge-pill badge-light">Warning</span>
                </small>
                
              </h5>

              <small class="text-muted"> ISPRS Ann. Photogramm. Remote Sens. Spatial Inf. Sci.,
                VI-4/W2-2020, 143–147, https://doi.org/10.5194/isprs-annals-VI-4-W2-2020-143-2020 
              
                <br>
                <button type="button" class="btn btn-outline-success btn-circle">  <i class="far fa-file-pdf"> </i></button>PDF
                <button type="button" class="btn btn-outline-danger btn-circle" data-toggle="collapse" data-target="#bibtex-paper-vision" aria-expanded="false" aria-controls="bibtex-paper-vision"> <i class="fas fa-code"></i> </button>BIB
                <button type="button" class="btn btn-outline-info btn-circle"> <i class="fas fa-globe"></i> </button>Link

                
              </small>
              <pre id="bibtex-paper-vision" class="pre-style collapse">@article{santhanavanich20203d,
                  title={3D SAFE ROUTING NAVIGATION APPLICATION FOR PEDESTRIANS AND CYCLISTS BASED ON OPEN SOURCE TOOLS.},
                  author={Santhanavanich, T and Wuerstle, P and Silberer, J and Loidl, V and Rodrigues, P and Coors, V},
                  journal={ISPRS Annals of Photogrammetry, Remote Sensing \& Spatial Information Sciences},
                  volume={6},
                  year={2020}
                }
              }</pre>

            </div>
          </div>
        </div>
      </div>
      
    </div>
    <div id="nextblock" class="container" style="margin-top:1em;"><p id="papercount">1 - 6 (45)</p>
    <button onclick="pagecountback()" id="previousbutton" class="previous" type="button" disabled>&laquo; Previous</button>  
    <!-- <a onclick="pagecountback()" id="previousbutton" class="previous"> Previous</a> -->
    <button onclick="pagecount()" id="nextbutton" class="next" type="button">Next &raquo;</button></div>
    
    <hr>
    <div class="container">
      <h2 id="rgc_ourteam"><i class="fas fa-user-friends"></i> Our amazing team</h2>
      <!-- Section description -->
      <p id="rgc_teamdesc" class="grey-text w-responsive mx-auto mb-5">Team Description ....</p>
      <section class="team-section text-center my-5">

        <!-- Grid row -->
        <div class="row" id="team-section">

          <!-- Grid column -->
          <div class="col-lg-3 col-md-6 mb-lg-0 mb-5">
            <div class="avatar mx-auto">
              <img src="./imgs/avatar/volker.Coors.jpg" class="rounded-circle z-depth-1" width="150px">
            </div>
            <h5 class="font-weight-bold mt-4 mb-3">Prof. Dr. Volker Coors</h5>
            <p class="text-uppercase blue-text"><strong>Lab Leader</strong></p>
            <a href="https://www.hft-stuttgart.de/p/volker-coors" target="_blank">
              <button class="btn btn-primary btn-sm profile">See full profile</button>
            </a>
            <p class="grey-text">Research topic: Smart Cities | OGC Standards | Sensors & IoT | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data</p>
            <ul class="list-unstyled mb-0">
              
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-researchgate"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-google"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-linkedin"></i>
              </a>
            </ul>
          </div>
          <!-- Grid column -->

          <!-- Grid column -->
          <div class="col-lg-3 col-md-6 mb-lg-0 mb-5">
            <div class="avatar mx-auto">
              <img src="./imgs/avatar/JoeSquare.jpg" class="rounded-circle z-depth-1" width="150px">
            </div>
            <h5 class="font-weight-bold mt-4 mb-3">Joe T. Santhanavanich</h5>
            <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
            <a href="https://www.hft-stuttgart.de/p/thunyathep-santhanavanich" target="_blank">
              <button class="btn btn-primary btn-sm profile">See full profile</button>
            </a>
            <p class="grey-text">Research topic: Smart Cities | OGC Standards | Sensors & IoT | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data</p>
            <ul class="list-unstyled mb-0">
              
              <a class="p-2 fa-lg" href="https://www.researchgate.net/profile/Thunyathep-Santhanavanich" target="_blank">
                <i class="fab fa-researchgate"></i>
              </a>
              <a class="p-2 fa-lg" href="https://scholar.google.com/citations?user=RKNY04EAAAAJ&hl=en" target="_blank">
                <i class="fab fa-google"></i>
              </a>
              <a class="p-2 fa-lg" href="https://www.linkedin.com/in/thunyatheps/" target="_blank">
                <i class="fab fa-linkedin"></i>
              </a>
            </ul>
          </div>
          <!-- Grid column -->


          <!-- Grid column -->

          <!-- Grid column -->
          <div class="col-lg-3 col-md-6">
            <div class="avatar mx-auto">
              <img src="./imgs/avatar/rosanny.jpg" class="rounded-circle z-depth-1" width="150px">
            </div>
            <h5 class="font-weight-bold mt-4 mb-3">Rosanny S.</h5>
            <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
            <a href="https://www.hft-stuttgart.de/p/rosanny-sihombing" target="_blank">
              <button class="btn btn-primary btn-sm profile">See full profile</button>
            </a>
            <p class="grey-text">Research topic: Smart Cities | 3D City Models | 3D Web Visualization | AR/VR</p>
            <ul class="list-unstyled mb-0">
              
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-researchgate"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-google"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-linkedin"></i>
              </a>
            </ul>
          </div>
          <!-- Grid column -->
          <!-- Grid column -->
          <div class="col-lg-3 col-md-6 mb-md-0 mb-5">
            <div class="avatar mx-auto">
              <img src="./imgs/avatar/PatrickSquare.jpg" class="rounded-circle z-depth-1" width="150px">
            </div>
            <h5 class="font-weight-bold mt-4 mb-3">Patrick Wuerstle</h5>
            <p class="text-uppercase blue-text"><strong>Researcher</strong></p>
            <a href="https://www.hft-stuttgart.de/p/patrick-wuerstle" target="_blank">
              <button class="btn btn-primary btn-sm profile">See full profile</button>
            </a>
            <p class="grey-text">Research topic: Smart Cities | OGC Standards | Participation Platform | 3D City Models | 3D Web Visualization | 3D Simulation | Big Data </p>
            <ul class="list-unstyled mb-0">
              
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-researchgate"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-google"></i>
              </a>
              <a class="p-2 fa-lg" href="#" target="_blank">
                <i class="fab fa-linkedin"></i>
              </a>
            </ul>
          </div>
        </div>
        <!-- Grid row -->

      </section>
      <!-- Section: Team v.1 -->
    </div>

  </main>
  <!-- Section: Team v.1 -->


  <footer class="text-white">
    <div class="container">
      <p class="float-right">
        <a id="rgc_backtotop" href="#">Back to top</a>
      </p>
      <p>&copy; HFT Stuttgart, 2020 - <span id="current-year"></span>.</p>
      <a href="https://www.hft-stuttgart.de/impressum" target="_blank">Impressum</a>
      <a href="https://www.hft-stuttgart.de/datenschutz" target="_blank">Datenschutz</a>
    </div>
  </footer>
  <!-- Test  -->
  <!-- /////////////////////////////////////// -->
  <!-- Language selector -->
  <!-- full jquery needed -->
  <!-- <script src="js/vendor/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
  <script src="js/vendor/simplebar/dist/simplebar.min.js"></script>
  <script src="js/vendor/smooth-scroll/dist/smooth-scroll.polyfills.min.js"></script>
  <script src="js/vendor/parallax-js/dist/parallax.min.js"></script> -->
  <!-- <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script> -->

  <script src="js/jquery-3.1.1.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.6.2/js/bootstrap-select.min.js"></script>
  <script src="./js/popper.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/flag-icon-css/0.8.2/css/flag-icon.min.css">
  <script src="js/config.js"></script>
  <script src="js/language.js"></script>
  <script src="js/add_content.js"></script>
  <script src="js/add_paper.js"></script>
  
  <!-- search library -->
  <script src="https://cdn.jsdelivr.net/npm/fuse.js/dist/fuse.js"></script>
  <link rel="stylesheet" href="./css/search.css">
  <link rel="stylesheet" href="./css/language.css">
  <script src="js/search.js"></script>

  <script src="js/paper_nextpage.js"></script>

  <script src="js/citationSheetParse.js"></script>


</body>

</html>