website logo
👥 Community🎯 Samples on GitHub🚦System Status
💡 Guides
🚀 Examples
🍕 Developer Reference
⚡️ Changelog
🎥 Video Library
Navigate through spaces
⌘K
Examples Overview
Setting up your solution
Jig Types
Components
Datasource
Actions
Preview
Widgets
Expressions
Aggregation
Boolean
Comparison Operators
Date & Time
Path Operators
Functional Programming
Jigx Variables
Predicate Queries
String
Docs powered by
Archbee
Components

interactive-image

4min

An interactive image is an image with clickable links that can be used in a variety of different ways. It can be used to click on a specific point to reveal information about that point, it can be used to indicate a selection for instance a booking, and it can be used as a multi-selection too.

This is typically used when the information you need to convey is better presented visually than in text.

The interactive component serves as a container for the interactive-image-item component.

The images can be preloaded and cached by using the assets property in your index.jigx file. The images will be displayed even when you are offline. For more details please refer to the Index settings

Configuration options

Some properties are common to all components, see Common component properties for a list and their configuration options.



The core structure includes: source

Other option:

data - The source of your data

imageHeight - The height of the image

groups - This includes title and id, but you can also set a specific color for your group and maximumPoints, which defines the maximum possible number of selected points. The groups property is used to specify certain groups to distinguish between selected/unselected and otherwise specified areas

pointColor - The color of the point(s) marked on the image.

item - There is only one available option - to use interactive-image-item

See also

  • Developer reference
  • interactive-image-item
  • Related examples (Github)



Updated 29 May 2023
Did this page help you?
PREVIOUS
image
NEXT
interactive-image-item
Docs powered by
Archbee
TABLE OF CONTENTS
Configuration options
See also
Docs powered by
Archbee
Copyright © 2023 Jigx, Inc. All rights reserved. Terms of Service