SVG లో Viewbox లక్షణాన్ని ఎలా అర్థం చేసుకోవాలి

'SVG' వీక్షణబాక్స్ (HTML) ను ఉపయోగించి వెబ్ డిజైన్ గైడ్

SVG ఆకారాలను సృష్టించేటప్పుడు సాధారణంగా ఉపయోగించబడే లక్షణం వీక్షణబాక్స్. పత్రాన్ని కాన్వాస్గా మీరు భావిస్తే, వీక్షణ పెట్టె మీరు వీక్షకుడు చూడాలనుకుంటున్న కాన్వాస్లో భాగం. పేజీ మొత్తం కంప్యూటర్ స్క్రీన్ను కప్పి ఉంచినప్పటికీ, ఈ సంఖ్య మొత్తంలో మూడింటిలో మాత్రమే ఉండవచ్చు.

మూడవ పక్షంలో జూమ్ చేయడానికి పార్సెర్ను చెప్పడానికి Viewbox మిమ్మల్ని అనుమతిస్తుంది. ఇది అదనపు తెలుపు స్థలాన్ని తొలగిస్తుంది. ఒక చిత్రం కత్తిరించడానికి ఒక వాస్తవిక పద్ధతిలో వీక్షణ బాక్స్ యొక్క థింక్.

ఇది లేకుండా, మీ గ్రాఫిక్ దాని అసలు పరిమాణం యొక్క మూడవ వంతు కనిపిస్తుంది.

వీక్షణపెట్టె విలువలు

ఒక చిత్రం కత్తిరించడానికి, మీరు కోతలు చేయడానికి చిత్రంలో పాయింట్లు సృష్టించాలి. వీక్షణ బాక్స్ లక్షణాన్ని ఉపయోగించినప్పుడు అదే నిజం. వీక్షణ బాక్స్ కోసం విలువ సెట్టింగులు:

వీక్షణ బాక్స్ విలువలు కోసం వాక్యనిర్మాణం:

viewBox = "0 0 200 150"

వీక్షణ బాక్స్ యొక్క వెడల్పు మరియు ఎత్తుని మీరు SVG డాక్యుమెంట్ కోసం సెట్ చేసిన వెడల్పు మరియు ఎత్తుతో కంగారుపడకండి. మీరు ఒక SVG ఫైల్ను సృష్టించినప్పుడు, మీరు స్థాపించిన మొదటి విలువల్లో ఒకటి డాక్యుమెంట్ వెడల్పు మరియు ఎత్తు. పత్రం కాన్వాస్. వీక్షణ బాక్స్ మొత్తం కాన్వాస్ను లేదా దానిలోని కొంత భాగాన్ని మాత్రమే కవర్ చేస్తుంది.

ఈ వీక్షణ పెట్టె మొత్తం పేజీని వర్తిస్తుంది.

ఈ వీక్షణ పెట్టె సగం పేజీ ఎగువ కుడి చేతి మూలలో ప్రారంభమవుతుంది.

మీ ఆకారం కూడా ఎత్తు మరియు వెడల్పు కేటాయింపులను కలిగి ఉంది.


ఇది ఎగువ కుడి చేతి మూలలో మొదలవుతుంది మరియు పేజీ సగం విస్తరిస్తుంది ఒక వీక్షణ బాక్స్ తో 800 x 400 px కప్పే పత్రం. ఆకారం వీక్షణ బాక్స్ ఎగువ కుడి చేతి మూలలో ప్రారంభమవుతుంది మరియు ఎడమ 100 px ఎడమ మరియు 50 px కదులుతుంది ఒక దీర్ఘ చతురస్రం.

ఎందుకు వీక్షణబాక్స్ను సెట్ చేయండి?

SVG కేవలం ఒక ఆకారం డ్రా కంటే ఎక్కువ చేస్తుంది. ఇది నీడ ప్రభావం కోసం మరొకటి పైన ఒక వ్యక్తిని సృష్టించవచ్చు. ఇది ఒక ఆకారాన్ని రూపొందిస్తుంది, తద్వారా ఇది ఒక దిశలో కలుపుతుంది. అధునాతన ఫిల్టర్ల కోసం, మీరు వీక్షణ బాక్స్ లక్షణాన్ని అర్థం చేసుకోవాలి మరియు ఉపయోగించాలి.