paper.rect(0, 0, settings.width, settings.height, settings.radius);
Создает хороший прямоугольник со скругленными углами. Действительно ли возможно создать прямоугольник со всего одним круглым углом?
Функция закругленных углов напрямую связана с базовыми атрибутами SVG rx
и ry
- они применяются ко всем прямоугольникам, поэтому нет возможности просто установить ее на один угол.
В этой записи блога обсуждается подход в SVG, позволяющий скрыть углы, которые не нужно скруглять. Хотя его примеры, похоже, сейчас не работают, подход должен быть довольно простым для реинжиниринга в SVG.
Альтернативным подходом может быть использование пути вместо объекта прямоугольника и рисование всего контура самостоятельно. Синтаксис немного неясен, но достаточно прост, когда вы поймете, что происходит. Попробуйте учебник SVG Path Якоба Йенкова для ознакомления.