Skip to main content
Solved

Can you use a hyperlink as the label attribute in a map created by the HTMLReportGenerator transformer?

  • July 16, 2021
  • 3 replies
  • 46 views
drc43
Contributor
Forum|alt.badge.img+12

I'm trying to build a workflow as such:

A user is presented with a HTML file showing a web map with features that is created by the HTMLReportGenerator. The user can click on a feature on the map displaying the tooltip which has a hyperlink as set in the Label Attribute setting in the transformer. The user can then click the hyperlink to be directed to an additional webpage or form.

Is it possible to have a hyperlink in this setting? Whenever I try it, the HTML page returns with no web map at all.

Best answer by chrisatsafe

Hi @drc43​ ,

 

Apologies for the late reply but in case you are still looking for the answer to this. 

 

You can achieve this by using the regular a href html tag but it's a bit of a two step process. 

  1. Create the label including some hyperlinked tag. 
  2. Use a couple of StringPairReplacers to ensure the labels/hyperlinks are correctly formatted after the HTMLReportGenerator. 

 

The HTMLReportGenerator does some character encoding so you need to fix it with the StringPairReplacers. If you inspect the HTML after the HTMLReportGenerator, you'll notice your a href tag in the label isn't quite right so the easiest way to fix it up is using the StringPairReplacers to put the encoded characters back to the appropriate character(s).

HTMLReportGenerator (note the < > ' ' characters output as encoded characters  &lt;  &#x27;  etc. ):

"popupContent":"&lt;a href=&#x27;https://www.safe.com&#x27; target=&#x27;_blank&#x27;&gt;CLICK HERE&lt;/a&gt; to go to our website!"

After StringPairReplacers

"popupContent":"<a href='https://www.safe.com' target='_blank'>CLICK HERE</a> to go to our website!"

 

Result!

 

2021-07-28_16-18-45I've attached the workspace for your reference :)

 

Hope that helps!

This post is closed to further activity.
It may be an old question, an answered question, an implemented idea, or a notification-only post.
Please check post dates before relying on any information in a question or answer.
For follow-up or related questions, please post a new question or idea.
If there is a genuine update to be made, please contact us and request that the post is reopened.

3 replies

chrisatsafe
Contributor
Forum|alt.badge.img+2
  • chrisatsafeContributor
  • Contributor
  • Best Answer
  • July 28, 2021

Hi @drc43​ ,

 

Apologies for the late reply but in case you are still looking for the answer to this. 

 

You can achieve this by using the regular a href html tag but it's a bit of a two step process. 

  1. Create the label including some hyperlinked tag. 
  2. Use a couple of StringPairReplacers to ensure the labels/hyperlinks are correctly formatted after the HTMLReportGenerator. 

 

The HTMLReportGenerator does some character encoding so you need to fix it with the StringPairReplacers. If you inspect the HTML after the HTMLReportGenerator, you'll notice your a href tag in the label isn't quite right so the easiest way to fix it up is using the StringPairReplacers to put the encoded characters back to the appropriate character(s).

HTMLReportGenerator (note the < > ' ' characters output as encoded characters  &lt;  &#x27;  etc. ):

"popupContent":"&lt;a href=&#x27;https://www.safe.com&#x27; target=&#x27;_blank&#x27;&gt;CLICK HERE&lt;/a&gt; to go to our website!"

After StringPairReplacers

"popupContent":"<a href='https://www.safe.com' target='_blank'>CLICK HERE</a> to go to our website!"

 

Result!

 

2021-07-28_16-18-45I've attached the workspace for your reference :)

 

Hope that helps!

chrisatsafe
Contributor
Forum|alt.badge.img+2
  • chrisatsafeContributor
  • Contributor
  • July 28, 2021

Hi @drc43​ ,

 

Apologies for the late reply but in case you are still looking for the answer to this. 

 

You can achieve this by using the regular a href html tag but it's a bit of a two step process. 

  1. Create the label including some hyperlinked tag. 
  2. Use a couple of StringPairReplacers to ensure the labels/hyperlinks are correctly formatted after the HTMLReportGenerator. 

 

The HTMLReportGenerator does some character encoding so you need to fix it with the StringPairReplacers. If you inspect the HTML after the HTMLReportGenerator, you'll notice your a href tag in the label isn't quite right so the easiest way to fix it up is using the StringPairReplacers to put the encoded characters back to the appropriate character(s).

HTMLReportGenerator (note the < > ' ' characters output as encoded characters  &lt;  &#x27;  etc. ):

"popupContent":"&lt;a href=&#x27;https://www.safe.com&#x27; target=&#x27;_blank&#x27;&gt;CLICK HERE&lt;/a&gt; to go to our website!"

After StringPairReplacers

"popupContent":"<a href='https://www.safe.com' target='_blank'>CLICK HERE</a> to go to our website!"

 

Result!

 

2021-07-28_16-18-45I've attached the workspace for your reference :)

 

Hope that helps!

Worth noting, if you are using this in an app that uses the data streaming service, you'll want to set target='_blank' in the tag so the link opens in a new tab! Otherwise, the user would have to re-run the app to see the map again.

drc43
Contributor
Forum|alt.badge.img+12
  • drc43Contributor
  • Author
  • Contributor
  • August 5, 2021

Hi @drc43​ ,

 

Apologies for the late reply but in case you are still looking for the answer to this. 

 

You can achieve this by using the regular a href html tag but it's a bit of a two step process. 

  1. Create the label including some hyperlinked tag. 
  2. Use a couple of StringPairReplacers to ensure the labels/hyperlinks are correctly formatted after the HTMLReportGenerator. 

 

The HTMLReportGenerator does some character encoding so you need to fix it with the StringPairReplacers. If you inspect the HTML after the HTMLReportGenerator, you'll notice your a href tag in the label isn't quite right so the easiest way to fix it up is using the StringPairReplacers to put the encoded characters back to the appropriate character(s).

HTMLReportGenerator (note the < > ' ' characters output as encoded characters  &lt;  &#x27;  etc. ):

"popupContent":"&lt;a href=&#x27;https://www.safe.com&#x27; target=&#x27;_blank&#x27;&gt;CLICK HERE&lt;/a&gt; to go to our website!"

After StringPairReplacers

"popupContent":"<a href='https://www.safe.com' target='_blank'>CLICK HERE</a> to go to our website!"

 

Result!

 

2021-07-28_16-18-45I've attached the workspace for your reference :)

 

Hope that helps!

Thanks for this @chrisatsafe​ !  I was short one StringPairReplacer and that was messing things up.

Community Stats

32,154
Posts
122,043
Replies
39,812
Members

Latest FME

Terms & ConditionsCookie settingsAccessibility statement
A product of
Safe Software respectfully acknowledges that we live, learn and work on the traditional and unceded territories of the Kwantlen, Katzie, and Semiahmoo First Nations.