RealEarth can be embedded in an existing webpage by creating a <div> object and passing an initialization object with the desired parameter values.

Code

Create a new RealEarth object from a <div>:


<!-- Establish DIV -->
<div id="re_canvas" style="width:800px;height:600px;">RealEarth</div>

<!-- Initialize ViewController -->
<script src="https://clouds.ssec.wisc.edu/js/RELoader.js"></script>
<script>
var options = {
  ui: true,
  selector: true,
  products: 'G18-C14',
  center: '38,-97',
  zoom: '4'
}
var reController = new ssec.realearth.ViewController('re_canvas', options);
</script>

Options

Value	Description	Format	Values	Default
iframe	Convert the <div> to an <iframe>. This is useful to prevent CSS conflicts with the container page.	Boolean	true,false	false
selector	Flag to enable/disable Product Selector	Boolean	true,false	1
ui	Flag to enable/disable the User Interface	Boolean	true,false	1

Code

Options

Example