How to create an interactive circular element for an ionic phone app?

I need to create an interactive circular element with the following specifications:

  1. Center must have another circle as an image, that would be clickable.

  2. Circle must be divided into 4 quadrants.

  3. Within each quadrant, images can be added based on some event handlers.

  4. The images within each quadrant must be movable/dragable on long-press.

I am using ionic framework for a phone app.

What are my options here: do I go with plain old HTML, use d3.js or some other JS library, or SVG? I am confused with what tech to use.

Any help to point me in the right direction would be highly appreciated, thanks!


Source: html5

Leave a Reply