@osh-branches/osh-js/vuepress/docs/src/index.md

OSH javascript Toolkit

---
home: true
heroImage: /images/bg.mp4
tagline: OpenSensorHub Web Toolkit provides the necessary tools to build your own web application for monitoring your sensors
actionText: Getting Started →
actionLink: /guide/
---
<div style="text-align: center">
  <Bit/>
</div>

<div class="features">
  <div class="feature">
     <ImageLoad src="/images/data-map.jpeg"/>
    <h2>Mixed data</h2>
    <p> Mix Video(H265, H264, VP9, VP8), Spectrogram, ImageDraping, Nexrad, any Swe generic(GPS, Quaternion, Weather temperature)..</p>
  </div>
  <div class="feature">
    <ImageLoad src="/images/drone.jpeg"/>
    <h2>Data visualization</h2>
    <p> Styling overlay using configurable layers as well as an advanced support
                       for video. It has been designed to integrate any map engines such as Lealfet, OpenLayer or Cesium.</p>
  </div>
  <div class="feature">
    <ImageLoad src="/images/sync.jpeg"/>
    <h2>Synchronized Temporal & Real time playback</h2>
    <p> Event based architecture suitable for real-time or playback with support of temporal
                       synchronization on multiple data stream.</p>
  </div>
  <div class="feature">
      <ImageLoad src="/images/ogc.jpg"/>
      <h2>Support for SOS & SPS</h2>
      <p> Supports SWE JSON generic requests: GetCapabilities, GetFeatureOfInterest, GetResultTemplate, DescribeSensor</p>
  </div>
  <div class="feature">
      <ImageLoad src="/images/technos.png"/>
      <h2>Pure ES6 Javascript code & Vue.js components</h2>
      <p> Pure javascript framework with some extended high level frameworks/APIs:
                          <ul>
                              <li>OpenLayers, Leaflet or Cesium for Map data</li>
                              <li>FFMPeg.js for Video Software decoding</li>
                              <li>Chart.js</li>
                          </ul>
      </p>
  </div>
  <div class="feature">
    <ImageLoad src="/images/vuejsreact.png"/>
    <h2>Toolkit integration</h2>
    <p> Integrate the toolkit inside your App using pure JS code or Vue.js based components</p>
  </div>
</div>