Interactive globe block

The Interactive Globe module provides a visually engaging way to display information around a globe-like interface. It allows users to interact with icons placed around a globe, revealing associated texts upon interaction.

You can look a video here

Features

- Display a customizable globe with background images.
- Place interactive icons around the globe.
- Show text related to each icon when interacted with.
- Flexible configuration for text formatting and icon placement.

Post-Installation

After installation, you can configure the Interactive Globe block by adding the block to a region and adjusting its settings:
- Background Image**: Set the URL for the globe's background image.
- Icons: Upload icons to be displayed on the globe.
- Texts: Associate each icon with text. You can format the text and choose whether to skip certain text filters.
Once configured, the Interactive Globe will display on the pages where you've placed its block. Users can interact with the icons to reveal associated texts.

Customization

- CSS: Customize the appearance of the globe, icons, and texts by editing `interactive-globe.css`.
- Templates: Modify `interactive-globe.html.twig` to change the markup of the globe and its elements.

Update

Add youtube control to stop video if you click on any icon.