SVG දර්ශකය
අමු SVG markup අලවා, render කළ ප්රතිඵලය වහාම පූර්වදර්ශනය කරන්න.
පූර්වදර්ශනය script සහ බාහිර යොමු අක්රිය කරන අතර, viewBox සහ ප්රමාණ විස්තර පරීක්ෂා කිරීමටත් ඉඩ දෙයි.
SVG පූර්වදර්ශනය: අමු කේතය අලවා ප්රතිඵලය වහාම පරීක්ෂා කරන්න
viewBox සහ ප්රමාණ පරීක්ෂා: පාරදෘශ්යතාව සහ විය හැකි අනාරක්ෂිත අන්තර්ගතය සමාලෝචනය කරන්න
භාවිතා කරන ආකාරය
- SVG code අලවන්න හෝ `.svg` ගොනුවක් පූරණය කරන්න.
- rendering පරීක්ෂා කිරීමට පසුබිම සහ zoom මට්ටම මාරු කරන්න.
- viewBox, ප්රමාණ විස්තර සහ අනතුරු ඇඟවීම් සමාලෝචනය කර, අවශ්ය නම් SVG සුරකින්න.
Sample
සරල අයිකන SVG
Input
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 120 120"><circle cx="60" cy="60" r="52" fill="#0ea5e9"/><path d="M36 62l16 16 32-40" fill="none" stroke="#fff" stroke-width="10" stroke-linecap="round" stroke-linejoin="round"/></svg>
Output
නිල් වටකුරු නිරූපකයක් දර්ශනය වේ, සහ viewBox එක තොරතුරු පුවරුවේ `0 0 120 120` ලෙස පෙන්වයි.
FAQ
මගේ SVG එක කොහේ හෝ උඩුගත කරනවාද?
නැත. අලවන ලද SVG සහ පූරණය කළ ගොනු ඔබගේ බ්රව්සරය තුළම රඳා থাকে සහ සේවාදායකයකට යවන්නේ නැත.
script හෝ foreignObject අඩංගු SVG වලට කුමක් සිදුවේද?
ආරක්ෂිත පූර්වදර්ශනය එම මූලද්රව්ය ඉවත් කර ප්රදර්ශනයට පෙර තබයි සහ තොරතුරු පුවරුවේ අවවාදයක් පෙන්වයි.
බාහිර රූප හෝ අකුරු අඩංගු SVG හරියටම එකම ලෙස දර්ශනය වේද?
සෑමවිටම නොවේ. බාහිර යොමු අවහිර කර ඇති බැවින් පෙනුම මුල් පරිසරයෙන් වෙනස් විය හැක. මෙම මෙවලම ආරක්ෂිත දේශීය පරීක්ෂාවට ප්රමුඛත්වය දෙයි.
මගේ SVG එක දර්ශනය නොවන්නේ ඇයි?
සාමාන්ය හේතු වන්නේ වලංගු නොවන XML, වැරදි ගුණාංග අගයන්, හෝ `svg` නොවන root මූලද්රව්යයකි. මෙවලම පෙන්වන දෝෂ පණිවිඩය පරීක්ෂා කරන්න.
පසුබිම මාරු කරන්නේ ඇයි?
පාරදෘශ්ය ප්රදේශ සහ සැහැල්ලු පැහැති නිරූපක පසුබිම අනුව බෙහෙවින් වෙනස් විය හැකි බැවින්, මෙවලම ඔබට checker, සුදු, සහ අඳුරු පසුබිම් ඉක්මනින් පරීක්ෂා කිරීමට ඉඩ දෙයි.
Notes
- ආරක්ෂාව සඳහා, බාහිර URL යොමු සහ අනාරක්ෂිත මූලද්රව්ය ප්රදර්ශනයට පෙර අක්රිය කරයි.
- බාහිර අකුරු හෝ රූප මත රඳා පවතින SVG, මුල් පරිසරයේ ඇති ආකාරයටම නොපෙනිය හැක.
- ඉතා විශාල SVG ගොනු ස්වයංක්රීයව සජීවී පූර්වදර්ශන මාදිලියෙන් ඉවත් වී අත්පොතෙන් ප්රදර්ශනය කිරීමට ඉල්ලා සිටී.