Package Exports

aframe-wms-component

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (aframe-wms-component) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

aframe-wms-component

An A-Frame component to deal with WMS (Web Map Service).

This library implements a WMS GetMap request, the result is a single image which is added into the component material "SRC:" parameter.

Make sure you request a valid WMS with the correct parameters.

Example with a globe: Example

Schema

Property	Description	Default Value	Required
url	The main URL of the WMS.		true
bbox	The bonding box of the requested area.		true
projection	The projection. This projection must be available in the WMS.		true
layers	The WMS layers which will be requested.		true
width	Image request width. It is recommended to change this value according to your needs.	250 px	false
height	Image request height. It is recommended to change this value according to your needs.	250 px	false
version	The WMS version.	1.3.0	false
format	The image format.	png	false
transparent	If true the resulting image will allow transparency.	true	false
styles	Used for specify the WMS/layer styles.	none	false

Installation

npm

Via npm:

npm install aframe-wms-component

Then

require('aframe');
require('aframe-wms-component');

Directly including the minified file

<html>
  <head>
    <title>A-Frame WMS Component - Simple example</title>
    <meta name="description" content="Simple example for WMS component in a flat panel."></meta>
        <script src="https://aframe.io/releases/0.7.1/aframe.min.js"></script> 
    <script src="https://unpkg.com/aframe-wms-component/dist/aframe-wms-component.min.js"></script> 
  </head>
  <body>
    <a-scene>
      <a-assets>
      </a-assets>
      <a-entity position="1 1.8 -2">
        <a-entity 
        material="color: #000;opacity:1;"
        geometry="primitive: plane; width:4;height:2;"
          wms="
          url: http://ows.terrestris.de/osm/service;
          bbox: -88,-180,88,180;
          projection: EPSG:4326;
          version: 1.3.0;
          format: PNG;
          layers: OSM-WMS;
          width: 4048;
          height: 2024;
          "
         /></a-entity>
        </a-entity>
    </a-scene>
  </body>
</html>

Examples

Simple plane

Rotating globe and a plane

Inverted globe

Further development

A WMS Get Feature Info request based on the raycaster may be implemented in future releases.