Comments 12
Так круто это все выглядит.
Жаль я совсем никак не связан с графиками :-)
Жаль я совсем никак не связан с графиками :-)
Может вы мне сможете ответить: можно ли нарисовать окружность с заданной толщиной линии с помощью одного свг элемента, используя только прямые линии и дуги окружности?
Просто, я не смог этого придумать, а задавать stroke-wide и рисовать полную окружность вместо заливки области между двумя окружностями как-то не хотелось. В итоге при аффинных преобразованиях иногда «бублик» может на пиксель вылазить за пределы части бублика за счет округления в вычислениях.
Просто, я не смог этого придумать, а задавать stroke-wide и рисовать полную окружность вместо заливки области между двумя окружностями как-то не хотелось. В итоге при аффинных преобразованиях иногда «бублик» может на пиксель вылазить за пределы части бублика за счет округления в вычислениях.
можно попробовать тег path. Нарисовать две дуги почти замкнутые на окружность и заштриховать область между ними. Покажите скан что у Вас выходит и что хотите сделать.
У меня сейчас нет доступа к коду, но общую суть и так могу передать. Хотел реализовать что такое:
Возможна ситуация, что внутри этой окружности может быть еще одна и т.д. цвет фона может быть прозрачный и много других мелочей, которые помешают.
Как нарисовать целую окружность одного цвета?
1. Нарисовать окружность и внутрь наложить еще одну цвета фона(если фон прозрачный — работает не корректно)
2. Нарисовать 2 половинки окружности без нахлеста: при зуммировании в FF и хроме иногда проскакивет не прорисованная полоска в точке соединения. Если с нахлестом: опять проблема с прозрачностью.
3. Нарисовать окружность и задать ей ширину линии. При повороте системы координат округление будет работать немного по разному для дуги окружности(которая рисуется path) и для целого бублика.
4. Всегда рисовать целую окружность и обрезать ее маской. Единственный рабочий вариант, но в эксплорере жутко тормозит.
честно говоря не знаю что делать
Возможна ситуация, что внутри этой окружности может быть еще одна и т.д. цвет фона может быть прозрачный и много других мелочей, которые помешают.
Как нарисовать целую окружность одного цвета?
1. Нарисовать окружность и внутрь наложить еще одну цвета фона(если фон прозрачный — работает не корректно)
2. Нарисовать 2 половинки окружности без нахлеста: при зуммировании в FF и хроме иногда проскакивет не прорисованная полоска в точке соединения. Если с нахлестом: опять проблема с прозрачностью.
3. Нарисовать окружность и задать ей ширину линии. При повороте системы координат округление будет работать немного по разному для дуги окружности(которая рисуется path) и для целого бублика.
4. Всегда рисовать целую окружность и обрезать ее маской. Единственный рабочий вариант, но в эксплорере жутко тормозит.
честно говоря не знаю что делать
Незнаю правельно ли понял я Вас, пример кода и демонстрационный пример
<path d="M0,-25A25,25 0 0 1 13.4178,21.0941L80.5067,126.5649A150,150 0 0 0 0,-150z" stroke="red" fill="red"/>
<path d="M13.4178,21.0941A25,25 0 0 1 -12.4329,21.6892L-74.5973,130.1355A150,150 0 0 0 80.5067,126.5649z" stroke="blue" fill="blue"/>
<path d="M-12.4329,21.6892A25,25 0 0 1 -22.9638,9.8826L-137.7826,59.2956A150,150 0 0 0 -74.5973,130.1355z" stroke="orange" fill="orange"/>Шаблон для штриховки дерева
Можно написать на js функцию, которая будет подгонят под нужные размеры.
Ну или использовать атрибут transform, может для ваших целей подойдет. Не знаю, что делать с не прямоугольными фигурами в этом случае.
Хорошо бы плагин для Inkscape.
Спасибо, нашёл в статье несколько интересных решений. С Вашего позволения, утащу их в свой проект.
Может быть окажется кому-нибудь полезным:
Смещение должно быть на ширину линии. Так, например, для первой линии x1 = 1 и y2 = 1 означает, что ширина линии штриховки равна 1.
<pattern id="hatch0_45" width="20" height="20" patternUnits="userSpaceOnUse">
<line class="lt2_025 " x1="1" y1="20" x2="20" y2="1" />
<line class="lt2_025 " x1="0" y1="1" x2="1" y2="0" />
</pattern>
Смещение должно быть на ширину линии. Так, например, для первой линии x1 = 1 и y2 = 1 означает, что ширина линии штриховки равна 1.
Sign up to leave a comment.
Чертежи в SVG формате. Часть 3. — Черновик стандарта