Skip to content

Commit

Permalink
✨ feat: add more information
Browse files Browse the repository at this point in the history
  • Loading branch information
@Zager-Zhang
Zager-Zhang committed Apr 10, 2024
1 parent 60df94a commit 3b199f8
Show file tree
Hide file tree
Showing 12 changed files with 145 additions and 50 deletions.
Binary file added assets/imgs/scene1.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/imgs/scene2.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/imgs/scene3.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added assets/imgs/scene4.jpg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed assets/videos/all2_pisa.mp4
View file
Binary file not shown.
Binary file removed assets/videos/all_pisa.mp4
View file
Binary file not shown.
Binary file removed assets/videos/expl_pisa.mp4
View file
Binary file not shown.
Binary file removed assets/videos/incremental_pisa.mp4
View file
Binary file not shown.
Binary file added assets/videos/start2.mp4
View file
Binary file not shown.
Binary file added assets/videos/video_scene1.mp4
View file
Binary file not shown.
18 changes: 9 additions & 9 deletions css/bootstrap-4.4.1.css
View file

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

177 changes: 136 additions & 41 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,21 @@
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>FC-Hetero: Fast and Autonomous Aerial Reconstruction Using a LiDAR-Visual Heterogeneous Multi-UAV System
</title>
<!-- Bootstrap -->
<link href="css/bootstrap-4.4.1.css" rel="stylesheet">
<link href="css/custom.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- <link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,800italic,400,700,800' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="css/project.css" media="screen" />
<link rel="stylesheet" type="text/css" media="screen" href="css/iconize.css" />
<script src="js/google-code-prettify/prettify.js"></script> -->
<script src="js/jquery-3.4.1.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"></script>
</head>


Expand All @@ -29,6 +33,26 @@
}
</style>

<style>
.video-grid-two-cols {
display: grid;
grid-template-columns: repeat(2, 1fr);
/* Two columns */
gap: 10px;
/* Gap between videos */
width: 100%;
/* Set the container width to 60% */
margin: 0 auto;
/* Center the container horizontally */
}

.video-grid-two-cols video {
width: 100%;
/* Videos fill the container width */
height: auto;
}
</style>

<!-- cover -->
<section>
<div class="jumbotron text-center mt-0">
Expand All @@ -37,7 +61,8 @@
<div class="col-12">
<h2>FC-Hetero: Fast and Autonomous Aerial Reconstruction Using a LiDAR-Visual Heterogeneous Multi-UAV System
</h2>
<h5 style="color:#5a6268;">Submitted to IROS 2024</h5>
<h5 style="color:#5a6268;">Submitted to International Conference on Intelligent Robots and Systems(IROS), 2024
</h5>
<hr>
<h6 style="line-height: 26px;">
<a href="http://sysu-star.com/people/" target="_blank">Mingjie Zhang</a><sup>1,3,*</sup>,
Expand Down Expand Up @@ -78,23 +103,35 @@ <h6 style="line-height: 26px;">
role="button" target="_blank">
<i class="fa fa-github-alt"></i> Code </a> </p>
</div>
<!-- <div class="column">
<p class="mb-5"><a class="btn btn-large btn-light" href="" role="button" target="_blank">
<i class="fa fa-database"></i> Datasets </a> </p>
</div> -->
<div class="column">
<p class="mb-5"><a class="btn btn-large btn-light" href="https://www.bilibili.com/video/BV1G1421Q79m/"
role="button" target="_blank">
<i class="fa fa-video-camera"></i> Video </a> </p>
</div>
<br>
<br>
<br>
<div class="text-container text-center">
<video autoplay muted controls style="max-width: 80%; height: auto;" id="all_pisa_video">
<source src="assets/videos/start.mp4" type="video/mp4">
</video>
</div>
<section>
<div class="video-grid-two-cols">
<div>
<video muted="" playsinline="" autoplay="" loop="" poster="" preload="auto"
style="max-width: 100%; height: auto;">
<source src="assets/videos/start.mp4" type="video/mp4">
</video>
</div>
<div>
<video muted="" playsinline="" autoplay="" loop="" poster="" preload="auto"
style="max-width: 100%; height: auto;">
<source src="assets/videos/start2.mp4" type="video/mp4">
</video>
</div>
</div>
<div class="columns is-centered has-text-centered">
<p style="margin-top: 5px; text-align: center; margin-bottom: -3%;">
Two demonstrations of FC-Hetero. (The left scene is Pisa Cathedral, and the right is Sydney Opera
House.)
</p>
</div>
</section>
</div>
</div>
</div>
Expand All @@ -108,7 +145,7 @@ <h6 style="line-height: 26px;">
<div class="warp-container">
<div class="row">
<div class="col-12 text-center">
<h3>Abstract</h3>
<h1>Abstract</h1>
<hr style="margin-top:0px">
<div class="text-container">
Unmanned Aerial Vehicles (UAVs) have gained significant popularity in scene reconstruction. In this paper,
Expand All @@ -123,8 +160,6 @@ <h3>Abstract</h3>
acquiring images. We present extensive benchmarks in the realistic simulator, which validates the
performance of FC-Hetero compared with classical and state-of-the-art methods.
</div>
<br>
<img src="assets/imgs/top.jpg" alt="Top" width="65%">
</div>
</div>
</div>
Expand All @@ -139,11 +174,9 @@ <h3>Abstract</h3>
<div class="warp-container">
<div class="row">
<div class="col-12 text-center">
<h3>System Overview</h3>
<h1>System Overview</h1>
<hr style="margin-top:0px">
<img src="assets/imgs/FC_Hetero_pipeline.png" alt="Top" width="90%">
<!-- <img src="https://raw.githubusercontent.com/SYSU-STAR/FC-Hetero/gh_pages/assets/imgs/FC_Hetero_pipeline.png" alt="Top"
width="90%"> -->
</div>
</div>
</div>
Expand All @@ -152,33 +185,46 @@ <h3>System Overview</h3>

<br>

<!-- Method Show -->
<section>
<div class="container">
<div class="warp-container">
<div class="row">
<div class="col-12 text-center">
<p class="text-center">
<h3>Method Details</h3>
<h1>Experimental Scenes</h1>
<hr style="margin-top:0px">
<h4>Surface Frontier Based Exploration with Large-scale Perception LiDAR</h4>
<div class="text-container">
<video autoplay muted controls style="max-width: 100%; height: auto;" id="expl_pisa_video">
<source src="assets/videos/expl_pisa.mp4" type="video/mp4">
</video>
</div>
<h4>Incremental Viewpoint Generation</h4>
<div class="text-container">
<video autoplay muted controls style="max-width: 100%; height: auto;" id="incremental_pisa_video">
<source src="assets/videos/incremental_pisa.mp4" type="video/mp4">
</video>
</div>
<h4>Overall</h4>
<div class="text-container">
<video autoplay muted controls style="max-width: 100%; height: auto;" id="all_pisa_video">
<source src="assets/videos/all_pisa.mp4" type="video/mp4">
</video>

<div id="carouselExampleIndicators2" class="carousel slide" data-ride="carousel" data-interval="10000">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="3"></li>
</ol>
<div class="carousel-inner text-center">
<div class="carousel-item active">
<img src="assets/imgs/scene1.jpg" alt="Top" width="100%">
</div>
<div class="carousel-item">
<img src="assets/imgs/scene2.jpg" alt="Top" width="100%">
</div>
<div class="carousel-item">
<img src="assets/imgs/scene3.jpg" alt="Top" width="100%">
</div>
<div class="carousel-item">
<img src="assets/imgs/scene4.jpg" alt="Top" width="100%">
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators2" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators2" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

</p>
</div>
</div>
Expand All @@ -187,6 +233,55 @@ <h4>Overall</h4>
</section>


<!-- Method Show -->
<section>
<div class="container">
<div class="warp-container">
<div class="row">
<div class="col-12 text-center">
<p class="text-center">
<h1>Experiment Details</h1>
<hr style="margin-top:0px">

<div id="carouselExampleIndicators" class="carousel slide" data-ride="carousel">
<ol class="carousel-indicators">
<li data-target="#carouselExampleIndicators" data-slide-to="0" class="active"></li>
<!-- <li data-target="#carouselExampleIndicators" data-slide-to="1"></li>
<li data-target="#carouselExampleIndicators" data-slide-to="2"></li> -->
</ol>
<div class="carousel-inner text-center">
<div class="carousel-item active" data-interval="30000">
<video autoplay loop muted style="max-width: 80%; height: auto;">
<source src="assets/videos/video_scene1.mp4" type="video/mp4">
</video>
</div>
<!-- <div class="carousel-item" data-interval="30000">
<video autoplay loop muted style="max-width: 80%; height: auto;">
<source src="assets/videos/video_scene1.mp4" type="video/mp4">
</video>
</div>
<div class="carousel-item" data-interval="30000">
<video autoplay loop muted style="max-width: 80%; height: auto;">
<source src="assets/videos/video_scene1.mp4" type="video/mp4">
</video>
</div>
</div> -->
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>

</p>
</div>
</div>
</div>
</div>
</section>


<!-- TODO -->
Expand Down

0 comments on commit 3b199f8

Please sign in to comment.