search

openwebwork / pg

Problem rendering engine for WeBWorK
http://webwork.maa.org/wiki/Category:Authors
Other
45 stars 76 forks source link

second PGlateximage test file not working #720

Open Alex-Jordan opened 2 years ago

Alex-Jordan commented 2 years ago

On a new Oracle Linux WW 2.17 installation, using TeXLive 2022 and dvisvgm version 2.13.3, the second PGlateximage test problem does not come out looking good. The image is tiny and far to the right.

Does anyone else experience this with 2.17 and whatever OS/LaTeX/dvisvgm you are using?

somiaj commented 2 years ago

Testing the problem here, it appears the height/width settings in the image function aren't the right aspect ratio for the image. So the image is shrunk and centered inside of the image element which has a fixed height/width. This causes the image to move to the right and look tiny as a result. In this case just adjusting the height/width to fit the aspect ratio of the image better would help. Changing the height/width to the following fixed the issue for me:

image($path, width => 114, height => 136, tex_size => 400)

I'm unsure if the texlive version would affect the size/aspect ratio of the resulting image or not. I'm using Debian Bullseye (11) with TeXLive 2020.20210202 and dvisvgm 2.11.1.

somiaj commented 2 years ago

Tested this using $drawing->ext('png');, and the image is stretched to fit the image size, so might just be a difference between .svg images keep the aspect ratio while .png images are stretched to fit the size given in the image function.

Alex-Jordan commented 2 years ago

Ah, so simply removing the height declaration could work. That should preserve aspect ratio. Is that what you find?

drgrice1 commented 2 years ago

In general the img tag in html should never be used with both a width and height attribute. (So for the pg image method this means you should not give the optional height parameter.) If you give both the width and height, then for png images the image will be stretched to fit those dimensions. This can skew things in the image if those dimensions don't match the aspect ratio of the image. If there is typography in the image that can make that hard to read. Of course svg images take more effort to make the scaling occur as you have observed.

If you look at the files t/tikz_tests/tikz_test2.pg and t/tikz_tests/tikz_test3.pg which I wrote you will see that this is the way I did it there. Although git blame attributes tikz_test1.pg to me as well, that file was copied from a previous pull request, and I didn't remove the height attribute (and should have).

On a side note, we shouldn't have separate tikz_tests and latex_image_test directories. Those are too closely related and should be put together into the latex_image_test directory.

drgrice1 commented 2 years ago

There seems to be another problem with the latex_image_test2.pg problem even if the height attribute is removed. In Firefox on Ubuntu 22.04 I don't see any images at all. It is there, but it is so wide that the image doesn't fit and the actual visible part of the image is to the right of the screen. If I make the browser stretch across both of my dual monitors, the image shows up to the far right. I can also click on the image, and the image is scaled to fit into the dialog and you see the image to the far right.

The problem is that the circuitikz drawing is started at the coordinates (60,1). It should start at (0,0) since everything in the image is relative to that starting point.

somiaj commented 2 years ago

Should the img elements from the image function have the img-fluid class added to them so they automatically shrunk to the size of the screen viewing them to be more responsive? Though this is a separate issue than this test.

drgrice1 commented 2 years ago

I don't think that adding the bootstrap img-fluid class is a good idea. Ideally all styling in PG should be in the problem.scss file, and not bootstrap. Of course there are lots of other places that bootstrap is used in PG.