PHPackages                             baztianzh/ux-interactive-image - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. baztianzh/ux-interactive-image

ActiveSymfony-bundle

baztianzh/ux-interactive-image
==============================

Interactive Image integration for Symfony

1.0.1(3y ago)08MITPHPPHP >=8.1

Since Jul 22Pushed 3y ago1 watchersCompare

[ Source](https://github.com/BaztianZH/ux-interactive-image)[ Packagist](https://packagist.org/packages/baztianzh/ux-interactive-image)[ RSS](/packages/baztianzh-ux-interactive-image/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (2)Dependencies (7)Versions (3)Used By (0)

Symfony UX Interactive Image
============================

[](#symfony-ux-interactive-image)

Symfony UX Interactive Image is a Symfony bundle integrating the [Interactive Image](https://interactive-image.readthedocs.io/en/latest/)jQuery plugin in Symfony applications. [main Symfony UX repository](https://github.com/symfony/ux)

Installation
------------

[](#installation)

Install this bundle using Composer and Symfony Flex:

```
composer require baztianzh/ux-interactive-image
```

Install dependencies

```
# Install the JavaScript dependencies
yarn install --force
yarn watch
```

Usage
-----

[](#usage)

### Basic usage

[](#basic-usage)

```
// ...
use BaztianZh\UX\InteractiveImage\Builder\InteractiveImageBuilderInterface;

class HomeController extends AbstractController
{
    #[Route('/', name: 'app_homepage')]
    public function index(InteractiveImageBuilderInterface $builder): Response
    {
        $interactiveImage = $builder->createInteractiveImage('/build/images/my-image.jpg');

        $textItem = new TextItem(200, 20,'title', 'description');

        $interactiveImage->addItem($textItem);

        return $this->render('home/index.html.twig', [
            'interactiveImage' => $interactiveImage,
        ]);
    }
}
```

### Render

[](#render)

```

      {{ render_interactive_image(interactiveImage) }}

  # You can customize by adding class
  {{ render_interactive_image(interactiveImage, {'class': 'my-class'}) }}
```

### Options

[](#options)

```
// ...
use BaztianZh\UX\InteractiveImage\Builder\InteractiveImageBuilderInterface;

class HomeController extends AbstractController
{
    #[Route('/', name: 'app_homepage')]
    public function index(InteractiveImageBuilderInterface $builder): Response
    {
        $interactiveImage = $builder->createInteractiveImage('/build/images/my-image.jpg');

        $textItem = new TextItem(200, 20,'title', 'description');

        $interactiveImage->addItem($textItem);

        # Change default options
        $interactiveImage->getOptions()
            ->setDebug(true)
            ->setShareBox(true)
            ->setSocialMedia($socialMedia)
            ->setTriggerEvent(TriggerEventName::HOVER)
            ->setAllowHtml(true)
        ;

        return $this->render('home/index.html.twig', [
            'interactiveImage' => $interactiveImage,
        ]);
    }
}
```

Documentation
-------------

[](#documentation)

For more information, check the [documentation](https://interactive-image.readthedocs.io/en/latest/index.html)

###  Health Score

24

—

LowBetter than 32% of packages

Maintenance20

Infrequent updates — may be unmaintained

Popularity4

Limited adoption so far

Community7

Small or concentrated contributor base

Maturity57

Maturing project, gaining track record

 Bus Factor1

Top contributor holds 100% of commits — single point of failure

How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window.

**Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores.

**Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement.

**Maturity (30%)** — Project age, version count, PHP version support, and release stability.

###  Release Activity

Cadence

Every ~0 days

Total

2

Last Release

1388d ago

### Community

Maintainers

![](https://www.gravatar.com/avatar/fa60a6e1408f8a0b2fd632df4bc968187ae3684276ae41cd0b66b2424df3eb04?d=identicon)[baztianzh](/maintainers/baztianzh)

---

Top Contributors

[![baztian2987](https://avatars.githubusercontent.com/u/106621420?v=4)](https://github.com/baztian2987 "baztian2987 (12 commits)")

---

Tags

symfony-uxinteractive-image

### Embed Badge

![Health badge](/badges/baztianzh-ux-interactive-image/health.svg)

```
[![Health](https://phpackages.com/badges/baztianzh-ux-interactive-image/health.svg)](https://phpackages.com/packages/baztianzh-ux-interactive-image)
```

###  Alternatives

[symfony/stimulus-bundle

Integration with your Symfony app & Stimulus!

17314.3M160](/packages/symfony-stimulus-bundle)[symfony/ux-chartjs

Chart.js integration for Symfony

1003.2M18](/packages/symfony-ux-chartjs)[web-auth/webauthn-framework

FIDO2/Webauthn library for PHP and Symfony Bundle.

50570.7k1](/packages/web-auth-webauthn-framework)[symfony/ux-dropzone

File input dropzones for Symfony Forms

541.5M4](/packages/symfony-ux-dropzone)[symfony/ux-lazy-image

Lazy image loader and utilities for Symfony

36335.2k](/packages/symfony-ux-lazy-image)[symfony/ux-toggle-password

Toggle visibility of password inputs for Symfony Forms

26508.0k5](/packages/symfony-ux-toggle-password)

PHPackages © 2026

[Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)