html-wcpms

An html component for Web Crop Phenology Metrics Service.

This html file contains all the code needed to fetch a phenology metric from the web service WCPMS and with the return display a graph plot.

Quick start

Add the simple-wcpms.html into the main app module of your project

<div id="myPlot" style="width:100%;position:relative;height:100%"></div>

The code in the <script> will fetch the wcpms api for the phenology metrics and feed the dynamic graph with the metrics and time series ready for visualization.

The html-wcpms component

Then use the collection, band, start_date, end_date, freq, latitude and longitude variables to query the data to the display component

var collection = "S2-16D-2";
var band = "NDVI";
var start_date = "2021-01-01";
var end_date = "2021-12-31";
var freq = "16D";
var latitude = "-11.749226797741814";
var longitude = "-45.75531005859376";

Development

This project uses Plotly version 3.0.1.