Publishing codes
Think of embed codes as instructions you give to your website to display an interactive visualization from everviz. Embed codes come in three different types; script, embed, and iFrame.
Remember, your choice among these embed codes depends on your specific needs. Consider the functionality required, customization options desired, and factors such as performance and security when deciding which embed code to use.
Where to find them
These codes appear in the publishing panel in everviz. To open the publishing panel, click the “Publish” button, as demonstrated in the picture below.
When the panel has opened, the choice between the three types of publishing codes appear in the section called “Embed to your page”.
To copy the line of code or link belonging to the publishing code, simply click the copy button – displayed as two pieces of paper. See picture below.
Script
A script is like a set of instructions that you can add to your website to make visualizations work. It's commonly used for loading external libraries or script files needed for displaying the visualization. With everviz, you can include a script tag in your HTML code, which will fetch and execute the necessary code to show the visualization.
How does it work?
- Think of the script code as a recipe that tells your website how to display the visualization. This code loads necessary files and libraries from everviz and uses them to show the visualization. You include this code in the HTML code of your website.
- When someone visits your website, the script code is executed, and the visualization appears on their page. You have full control over the visualization, and if you want to change the data being displayed, you can update the code or use specific methods provided by everviz.
Advantages:
- Easy to use.
- Scales automatically to fit screen size
- Gives you full control over the visualization by allowing you to modify and customize the JavaScript code.
- Enables you to add advanced features and interactivity to the visualization.
Disadvantages:
- Requires users to download and run external JavaScript files.
- Large libraries may slow down your page loading time.
When to use it?
Use script code when you want complete control over the visualization, and you're comfortable modifying JavaScript code. This is particularly useful when using advanced chart or map libraries with extensive customization options.
Embed
Embed links to the visualization only, covering the full page. An embed code is a simple HTML code that you can copy and paste into your website to display the visualization. everviz provides this code, which can be an iframe or another suitable HTML structure.
How does it work?
- Think of the embed code as a ready-made puzzle set that you can place on your website to display the visualization. You copy and paste this code directly into the HTML code of your website.
- When the website loads, the embed code is processed, and the visualization appears on the page. The embed code from everviz contains all the necessary information to display the visualization, so you don't need to download any additional files. However, the options for customizing interactions and design are slightly limited compared to the script code.
Advantages:
- Easy to use, similar to the script code.
- No need to download external files.
- Compatible with most browsers.
Disadvantages:
- Limited to the functionality provided by everviz.
- Less flexibility for customization compared to JavaScript-based options.
When to use it?
Used when publishing to a CMS or embedding to PowerPoint, or platforms such as Medium. everviz offers a straightforward embed code that provides the necessary functionality. It's useful when you want to quickly include visualizations without extensive customization or advanced features.
iFrame
iFrame (inline frame) includes the chart in your page through a window that has fixed height. An iFrame is an HTML element that allows you to embed an external HTML page within a frame on your website. You can use this when you want to display visualizations from everviz, which provides a pre-built HTML page for this purpose.
How does it work?
- Think of the iFrame as a window on your website that shows the visualization from everviz. You place a special HTML code (iFrame code) on your website, and this code fetches the visualization from everviz and displays it within the frame.
- When the page loads, the visualization is fetched from everviz and shown within the iFrame frame on your website. You can think of it like displaying a picture in a frame on your wall. You have limited control over the visualization since it comes from an external source.
Advantages:
- Allows easy display of everviz visualizations.
- Lets you integrate content from everviz within a single frame.
Disadvantages:
- Limited control over the visualization, as the content is provided externally.
- Advisable only if your CMS does not support scripts.
- Considerations for security, as there is a possibility of embedding malicious content.
When to use it?
This is useful when the visualization is available as a separate HTML page that can be displayed within a frame on your website. iFrame code enables you to integrate content from different websites into a single frame.
Changing the data – do I need to republish?
When you want to change the data afterwards, it depends on the publishing code you are using:
- With script code, you can update the data directly in the code or use specific methods provided by everviz.
- With embed code, you need to replace the existing code with a new code that includes the updated data.
- With iFrame code, you can update the data on the separate HTML page that is embedded within the iFrame.