1

Тема: Як зменшити розмір SVG ?

viewBox тільки вирізає шматок. А як підігнати все зображення під потрібний розмір ?

2

Re: Як зменшити розмір SVG ?

код в студію

Прихований текст

будь ласка

Прихований текст

курво

Подякували: leofun011

3

Re: Як зменшити розмір SVG ?

preserveAspectRatio

4

Re: Як зменшити розмір SVG ?

<svg width="440" height="440" viewBox ="0 0 220 220">

preserveAspectRatio що none, що meet все одно вирізає лівий верхній шмат, замість зменшити у 2 рази

5

Re: Як зменшити розмір SVG ?

так може спробувати змінити width та height до 220 ?

6

Re: Як зменшити розмір SVG ?

FakiNyan написав:

так може спробувати змінити width та height до 220 ?

при  такому розмірі канви path не вміститься

7

Re: Як зменшити розмір SVG ?

а весь код можете скинути, шоб мона було поексперементувати?

8

Re: Як зменшити розмір SVG ?

FakiNyan написав:

а весь код можете скинути, шоб мона було поексперементувати?

<svg width="440" height="440" viewBox="0 0 200 200" preserveAspectRatio="none"><style>.tank_head { font: italic 15px sans-serif; }.tank_param { font: bold 30px sans-serif; }.st3 {fill: url(#tg);stroke:black;stroke-width:1.5;stroke-miterlimit:10;}</style><linearGradient id="lg" x1="0.5" y1="1" x2="0.5" y2="0"><stop offset="0%" stop-opacity="1" stop-color="green"></stop><stop offset="75%" stop-opacity="1" stop-color="green"></stop><!--fill tag tank--><stop offset="75%" stop-opacity="0" stop-color="green"></stop><!--fill tag tank--><stop offset="100%" stop-opacity="0" stop-color="green"></stop></linearGradient><linearGradient id="tg" x1="0.5" y1="1" x2="0.5" y2="0" gradientTransform="rotate(270)"><stop offset="0%" stop-opacity="1" stop-color="red"></stop><stop offset="10%" stop-opacity="1" stop-color="red"></stop><!--fill tag termo--><stop offset="10%" stop-opacity="0" stop-color="red"></stop><!--fill tag termo--><stop offset="100%" stop-opacity="0" stop-color="red"></stop></linearGradient><circle cx="200" cy="200" r="150" stroke="black" stroke-width="2" fill="url(#lg)"></circle><text x="30" y="30" class="tank_head"> Назва:</text><text x="110" y="130" class="tank_param"> 000000,0 СМ.</text><text x="110" y="180" class="tank_param"> 000000,0 Л.</text><text x="110" y="230" class="tank_param"> 000000,0 КГ/М³.</text><text x="110" y="280" class="tank_param"> 000000,0 КГ.</text><text x="380" y="50" class="tank_param"> 00,0 С°</text><path d="M552 98.1c-14.4 0-27-7.5-33.6-18.5H44.8c-8.4 0-15.8-7.1-15.8-15.5v-4.8c0-8.3 7.4-14.8 15.8-14.8H518c6.5-11 19.3-19.4 33.9-19.4 21.3 0 38.5 16.3 38.5 36.4.1 20.3-17.2 36.6-38.4 36.6z" class="st3" transform="rotate(90 200 250) scale(0.5)"></path></svg>

9

Re: Як зменшити розмір SVG ?

cheappi386 написав:

viewBox тільки вирізає шматок. А як підігнати все зображення під потрібний розмір ?

viewBox - це та частина, яку треба показати. Встановити ширину і висоту можна через атрибут style:

<?xml version="1.0" encoding="utf-8" ?>
<svg
    xmlns="http://www.w3.org/2000/svg"
    width="440"
    height="440"
    viewBox="0 0 400 400"
    style="width: 200px; height: 200px;"
>
    <!-- ... -->
</svg>
Подякували: koala, pluszz, cheappi3863

10

Re: Як зменшити розмір SVG ?

дуже дивно що тільки пан leofun01 про це знав

11

Re: Як зменшити розмір SVG ?

cheappi386 написав:

дуже дивно що тільки пан leofun01 про це знав

Тепер всі будемо знати.

Подякували: leofun01, cheappi3862