Как сделать круговой индикатор



  • Добрый день.
    Есть ли возможность сделать круговой индикатор? по типу того который появляется при импорте проекта. Что думал-думал не могу придумать из чего его сделать. В других IDE делал из сектора, если нет готового.



  • @JuryGT Можно сделать любой индикатор, Возьмите в качестве подложки любую картинку. Сверху стрелку. Все изображения желательно в формате SVG
    Вот здесь есть пример: https://docs.intrahouse.ru/ru/pg065



  • Я имел ввиду что-то похожее на
    784d79fa-409c-43b3-bdff-3add0336902d-image.png

    Как сделать это стрелкой?



  • Была бы кривая или сектор я бы попытался сам сделать. Может можно для этих целей использовать PIE?
    Секторный график но пока не додумался как



  • @JuryGT Да, вы правы. Для этого нужен элемент сектор.



  • @JuryGT Не помню, у каких "конкурентов", SimpleScada, наверно, подобное "невозможное" через много картинок (в примере их полсотни было) делалось.

    Идея та же - сделать SVG подложек с шагом, например, 10% и показывать их в зависимости от state... Но это если очень хочется такой возни. И как бы не пришлось все 100 картинок делать, ещё плохо знаю, можно ли в state загнать диапазон под одно состояние.

    ЗЫ: если бы можно было менять css/свойства внутри svg в зависимости от переменной, то, вероятно было бы проще - через анимацию править содержимое svg... Я так рисовал круговой задатчик времени а-ля розетка-таймер когда-то



  • Через картинки понятно но этот вариант я сразу отбросил как не эффективный. Попробую через секторную диаграмму, пока с наскока не разобрался как она работает



  • @JuryGT Через секторную диаграмму вряд ли получится. Она не изменяется динамически.
    Через кучу картинок вариант рабочий, но слишком замороченный. Кстати в этом случае достаточно одной картинки с сектором, установленной в шаблоне несколько раз с поворотом.
    Думаю правильно сделать элемент сектор. Только не могу обещать по времени, как быстро мы это сделаем.


Авторизуйтесь, чтобы ответить