We produce icons in Illustrator as SVGs and then produce font based icons with fontcustom. Out of no where, they were coming in too low. I found in the svg this odd viewBox with a negative 49 on it. How is this controlled in Illustrator? I don't want any viewbox, I just want a perfectly centered icon. I also see that it thinks that it is grouped. My only fix is to ungroup, and then set the X and Y to zero, and it works. It does put in a transform compensating to -49 on the layer. Something is causing this odd offset.
<svg version="1.1" id="Layer_1" xmlns:x="&ns_extend;" xmlns:i="&ns_ai;" xmlns:graph="&ns_graphs;"
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="-49 141 512 512"
style="enable-background:new -49 141 512 512;" xml:space="preserve">
Viewbox in illustrator is based on the art board I believe and it's a pain to get it to match the artwork exactly. The easy way to zero it all out is to just highlight the object in illustrator select copy.. then go to your code editor, make a new document and paste it. It will copy the svg code with a the view box set correctly(starting at 0,0). Then just save the file as an svg and you're done.
Related
Consider the following SVG:
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 40 20">
<g shape-rendering="crispEdges">
<rect x="0" y="0" width="20" height="20" fill="#b4b4b4"/>
<rect x="20" y="0" width="20" height="20" fill="#b4c4b4"/>
</g>
</svg>
The intended effect of the shape-rendering="crispEdges" annotation is to prevent there being a visible seam between the two rectangles, no matter how the rendering is scaled. This works as intended when viewing the SVG file in both Firefox and Chromium. However, when I convert the SVG into a PDF using inkscape -A and view the PDF, I can still see a visible seam at some zoom levels, e.g. as in this screen shot:
Moreover, the PDF page stream produced by inkscape is identical with and without shape-rendering="crispEdges"
1 0 0 -1 0 15 cm
q
0.705882 0.705882 0.705882 rg /a0 gs
0 0 15 15 re f
0.705882 0.768627 0.705882 rg 15 0 15 15 re f
Q
and the /ExtGState dictionary referenced as /a0 is also identical:
/ExtGState <<
/a0 <<
/CA 1
/ca 1
>>
>>
This could mean that there is no equivalent in PDF of this SVG feature, or it could mean that Inkscape's PDF exporter doesn't implement the equivalent. I'm not having any luck finding anything that sounds like this SVG feature in the PDF specification, which is an argument in favor of "no equivalent", but the PDF spec is gigantic and I could easily have missed something.
So the question is: Is or isn't there an equivalent in PDF of this SVG feature, and if there is, how do I use it? I am prepared to edit my exported PDF by hand if I have to.
Note 1: The example is minimal; I originally noticed the problem with a much more complicated figure from an academic paper, in which there are many such rectangles aligned to a grid, but some grid positions are empty. I tried enlarging the rectangles in the original figure so they would overlap, and I was not able to find an amount of enlargement that eliminated all visible seams without also visibly causing the rectangles to bleed into the empty spaces.
Note 2: With the original figure, the problem is visible with Evince, pdf.js, and two printers manufactured by different companies.
The closest thing in PDF would be to use shading meshes (e.g. tensor and lattice free form meshes). This will remove the slivers in most viewers.
Some PDF viewers ( like Acrobat, Xodo/PDFTron) have options that minimize the appearance of these slivers, but generally it's not well implemented across many implementations.
I create a SVG image with one rectangle. Attributes width & height units in mm:
<svg
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
width="210mm"
height="297mm"
version="1.1">
<rect
style="opacity:1;fill:none;stroke:#000000;stroke-opacity:1;stroke-width:0.5"
width="100mm"
height="100mm"
x="40mm"
y="60mm" />
</svg>
Then i convert that SVG with Inkscape and also with Apache Batiks SVG Rasterizer to PDF documents and print it on paper.
In both cases, a few millimeters are missing on the printed paper. The rectangle must be 100mm x 100mm, but it is accurate 97mm x 97mm. The larger the rectangle, the more millimeters missing.
To test my printer, i create a PDF with a PDF editor (Master PDF Editor) and a rectangle of 100mm x 100mm. In this printed PDF the rectangle is very accurate 100mm x 100mm.
How do you get the millimeter from the SVG without loss of size (or profit) on paper?
Thanks to RMo.
With Master PDF Editor is all ok, also the rectangle from SVG PDF.
Now i set in my PDF reader Okular (at print dialog) the margins to 0. Super, all is OK, the rectangle prints out with 100mm x 100mm.
Master PDF Editor has as default no margins or scalings.
In Gnome Evince, the scaling in the print dialog is set to 0 and everything is fine here as well. There are no margins.
I have a userform. In multiple cases across several different controls, I have observed the objects with the same Width, Height, Font, and Font Size display different font sizes depending on where they are placed on my userform.
. . . .
Above is an example of this. The two textbox's are both 26H and 48W, with a Left of 90. Both have font Tahoma Regular size 18. The only difference between them is their Top property. And yet visually, the upper one has much wider text than the lower one. The picture on the right has added dots to prove this is not an optical illusion. The upper one can only fit one dot between the letter and the edge. The lower one can fit at least two dots between the letter and the edge.
Can anyone explain why this is happening? What is happening? Or how I could stop it from happening?
Why its happening?
A normal windows graphical application renders in 96dpi/ppi.
However, excel’s rendering system is in 72dpi/ppi,so, when you specify 26 as the height, excel will first convert 72 to 96 dpi.
26 x 96 / 72 = 34.6667
Which means your control height is 34.667 pixels.
This will create artefacts in the rendering of your control.
How can you stop it?
Make sure that the final position of your control and its height has a final pixel position in the form to be a whole number.
You can do this by multiplying by your screen dpi and divide by excel dpi(72)
In your case you can apply a height of 25.5 which will render it correctly.
I hope I solved your answer!!
As Krishna Soni says in this thread, you should use a height of 25.5 for all the reasons he present.
This is equivalent to using controls with a height that is a multiple of 3. Since the rounding of 25.5 is 30, we can take 3 as a multiple of the Top, Height, and Width properties and avoid the text resizing issues.
Seen on Weird change of font size when changing Top proprierty by 1
I have a photoshop file with several layers (all shapes, no bitmaps). Is there any automatic way I could extract the colours from all these shapes into a palette? Any advice would be great!
You can do that from the commandline with ImageMagick if you want to. It is installed on most Linux distros and available for Mac OSX and Windows.
So, if I start with this Photoshop file:
and do this:
convert image.psd -flatten -unique-colors palette.png
I get this (I have enlarged it 5000% so you can see it):
Or, if you want it as text:
convert image.psd -flatten -unique-colors txt:
# ImageMagick pixel enumeration: 5,1,255,srgb
0,0: (0,0,0) #000000 black
1,0: (255,0,0) #FF0000 red
2,0: (0,255,0) #00FF00 lime
3,0: (0,0,255) #0000FF blue
4,0: (255,255,255) #FFFFFF white
Without knowing your source image, I can't say for sure, but as far as I know, the only real palette exists with bitmap images of indexed color.
So you'd change your color mode to "indexed", giving you a 256 color palette ready for export.
Depending on your use case that may already be enough – you can also try to export a file with as few colors as possible (saving a GIF), giving you the opportunity to filter down on the most used colors in your image.
Is it possible to create a tiff file from a postscript-file (created from a pdf-document with readable text and images) into a tiff file without the text and only the images?
There is a way to create a tiff with no images, but I don't know how to use that way for my task. I need it to generate two images from a postscript-file - the first one with the images only and the second one with the text only.
Since the text is drawn over the top of the image, simple clipping won't do the job.
You can hack the text out by redefining the show operators to no-ops. Insert this after the %%Page comment line (where the page code really starts).
/show{pop}def
/ashow{3{pop}repeat}def
/widthshow{4{pop}repeat}def
/awidthshow{6{pop}repeat}def
/kshow{2{pop}repeat}def
/xshow{2{pop}repeat}def
/xyshow{2{pop}repeat}def
/yshow{2{pop}repeat}def
/glyphshow{pop}def
/cshow{2{pop}repeat}def
This will suppress all text-drawing operators. Edit: Now includes level 2 and 3 operators.
If you're trying to selectively suppress different kinds of elements, you may want to redefine only some of these operators. You can add % at the beginning of a line to comment-out a line of the code, keeping the full list intact (for future uses).
Another way to selectively suppress elements from a ps file is to use the powerful clipping mechanism.
144 288 72 72 rectclip % clip to a 1"x1" square 2" from the left, 4" from the bottom
Clip works with an arbitrary path. So you can even string together points in a connect-the-dots fashion to get the effect of a lasso-clip. Probably easiest if you print the image out and trace a grid to easily plot points for the trajectory.
100 100 moveto
200 200 lineto
300 100 lineto
500 500 lineto
200 700 lineto
closepath clip % clip to a non-rectangular convex polygon
Clipping will suppress all drawing operations that fall outside of the clippath while the clipping path is in effect.