Круговая диаграмма с помощью Aura

Всем Привет.

Нужна помощь.

Нужно,что бы круговая диаграмма(аля donut chart) была закрашена в соответствии с указанными процентами. И использовать только 2 цвета.

Тоесть если у нас 38%, то 38% должны быть закрашены в синий,а 62% в белый.

И всё это нужно написать с помощью Aura)

Буду благодарна за идеи,как это реализовать.

Как вариант, диаграмма на чистом css. Разберитесь с разметкой и в нужных местах поставьте переменные и меняйте динамически:
https://codepen.io/hilar47/pen/RprXev

2 Likes

не уверен, что в ауре есть стандартный компонент для такого.

так что нужно найти какую-нибудь JS библиотеку, которая рисует такие бублики,

и попробовать прикрутить ее к ауре

Есть в ауре конечно
https://developer.salesforce.com/docs/component-library/bundle/lightning-progress-ring/example

это не круговая диаграмма

Как раз таки это круговая диаграмма, значение которой задается в js, а цвет и размер можно отрегулировать стилями