![]() However, it still won’t scale quite like any other image. Once you add a viewBox to your (and editors like Inkscape and Illustrator will add it by default), you can use that SVG file as an image, or as inline SVG code, and it will scale perfectly to fit within whatever size you give it. If you wanted to draw a circle that completely filled the image area, it would be centered at (0, 0). Any shapes drawn at (100, 100) will be far offscreen. Which means that the bottom-rightcorner has the coordinates (+50, +50). viewBox="-50 -50 100 100": A view with the same scale, but now with the top-left corner given the coordinates (-50, -50).viewBox="5 0 90 100": Almost the same view, but cropped in by 5% on the left and right, so that the total width=90 units and the x-coordinate on the left=5.If your SVG contained a rectangle with height="1in", it would also nearly fill up the screen, because 1 inch = 96px in CSS, and all lengths will get scaled equally. In other words, if your SVG contains a circle centered in the graphic with radius of 50px, it would fill up the height or width of the SVG image, even if the image was displayed full screen. ![]()
0 Comments
Leave a Reply. |