src/components/legend.js
function getRemoteLegend(href) {
  let ref = null;
  const div = (<div ref={(me) => {
    ref = me;
  }} />);

  // kick off the href fun!
  fetch(href).then(response => response.text())
    .then((html) => {
    // This is equivalent to dangerouslySetInnerHTML
      if (ref !== null) {
        ref.innerHTML = html;
      }
    }).catch((error) => {
      console.error('An error occured.', error);
    });

  return div;
}
function getRemoteLegend(href) {
  let ref = null;
  const div = (<div ref={(me) => {
    ref = me;
  }} />);

  // kick off the href fun!
  fetch(href).then(response => response.text())
    .then((html) => {
    // This is equivalent to dangerouslySetInnerHTML
      if (ref !== null) {
        ref.innerHTML = html;
      }
    }).catch((error) => {
      console.error('An error occured.', error);
    });

  return div;
}
function getRemoteLegend ( href ) { let ref = null ; const div = ( < div ref = { ( me ) => { ref = me ; } } / > ) ; // kick off the href fun! fetch ( href ) . then ( response => response . text ( ) ) . then ( ( html ) => { // This is equivalent to dangerouslySetInnerHTML if ( ref !== null ) { ref . innerHTML = html ; } } ) . catch ( ( error ) => { console . error ( 'An error occured.' , error ) ; } ) ; return div ; }
@module components/legend
@desc React Component to render the legend data.
Create legend objects using the metadata prefixes
"bnd:legend-type" and "bnd:legend-contents".
Neither the Mapbox GL Spec nor the specific underlying
services for vector layers have a standardized way of
providing legends.  This is using the metadata provided
by the layer to do so.
"bnd:legend-type" can be one of "image", "html", "href"
where "bnd:legend-content" would then provide the appropriate
additional information.
"bnd:legend-type" : "image", "bnd:legend-content" would provide
the src attribute for an <img>
"bnd:legend-type" : "html", "bnd:legend-content" would provide
the html content for a <div>
"bnd:legend-type" : "href", "bnd:legend-content" would provide
the URL for html content.
 Return a div that is asynchronously populated
with the content from the parameter href.

@param {string} href The location of the content for the div.

@returns {Object} A <div> element.
@module components / legend @desc React Component to render the legend data . Create legend objects using the metadata prefixes bnd : legend - type and bnd : legend - contents . Neither the Mapbox GL Spec nor the specific underlying services for vector layers have a standardized way of providing legends . This is using the metadata provided by the layer to do so . bnd : legend - type can be one of image html href where bnd : legend - content would then provide the appropriate additional information . bnd : legend - type : image bnd : legend - content would provide the src attribute for an <img > bnd : legend - type : html bnd : legend - content would provide the html content for a <div > bnd : legend - type : href bnd : legend - content would provide the URL for html content . Return a div that is asynchronously populated with the content from the parameter href .