Við styðjum ekki Internet Explorer 11 eða eldri. Vinsamlega skoðaðu https://outdatedbrowser.com fyrir lista yfir vafra sem við styðjum.
Here is the minimum amount of code needed for the Environmental Statistics Widget to work.
<script type="text/javascript" src="https://app.taktikal.is/widget/init.js"></script>
<iframe
id="taktikal-widget"
src="https://app.taktikal.is/api/widget/cXcrUHdhaFdaNER2dFoyTkhsSGJhOVFGVFlmL3h3Mk9hN3VvMHNQNFArbz0?colorPrimary=2823FB&colorOffWhite=f8f8f8"
frameborder="0"
width="100%"
></iframe>
<script>
TaktikalWidget.init(document.getElementById("taktikal-widget"));
</script>
The first script
creates the TaktikalWidget
object. It should be placed before the iframe
in the DOM.
<script type="text/javascript" src="https://app.taktikal.is/widget/init.js"></script>
The iframe
includes the statistics themselves and renders them at the width it has available to it.
<iframe
id="taktikal-widget"
src="https://app.taktikal.is/api/widget/cXcrUHdhaFdaNER2dFoyTkhsSGJhOVFGVFlmL3h3Mk9hN3VvMHNQNFArbz0?colorPrimary=2823FB&colorOffWhite=f8f8f8"
frameborder="0"
width="100%"
></iframe>
But the height of the iframe
's content may be different depending on the width. This means that we can't know the height of the iframe
beforehand. To combat this, the iframe
sends events communicating its own height.
By calling TaktikalWidget.init(iframeElement)
the TaktikalWidget
listens to those events and takes care of initializing and maintaining the iframe
's height correctly.
<script>
TaktikalWidget.init(document.getElementById("taktikal-widget"));
</script>
The colors used in the iframe
can be configured. We've added the company's colors from our branding settings as colorPrimary
and colorOffWhite
, but these colors can be changed to any valid hex color. If the company has not configured their brand colors in our settings, the default Taktikal colors will be used.
You can change the colors of the widget by modifying the colorPrimary
and colorOffWhite
query parameters.
The value should be a hex color without the #
like 2823fb
.
By default the widget's mobile breakpoint is set to 768
. You can change this by providing a breakAt
query parameter. breakAt
should be an integer.
Our widget supports two languages, is
(Icelandic) and en-us
(English). The language is determined by the language
query parameter.
<iframe
src="https://app.taktikal.is/api/widget/:key?language=en-us"
></iframe>
If no language or an invalid language is provided, the widget defaults to is
.