Comments (7)
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.
from pg.
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.
from pg.
Ah, so simply removing the height declaration could work. That should preserve aspect ratio. Is that what you find?
from pg.
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.
from pg.
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.
from pg.
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.
from pg.
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.
from pg.
Related Issues (20)
- Bug when a matrix Math Object is reused as an answer HOT 10
- PGML.pl has lines that should have been removed. HOT 1
- checkboxlist within a RadioMultiAnswer HOT 4
- Using upToConstant with complex numbers HOT 4
- keyboard issue with GraphTool HOT 7
- inconsistency in multiple choice macros HOT 3
- run-perltidy deletes .bak files
- Error answers now are escaped when they shouldn't be. HOT 1
- Cropping from pgfplots is not always working for final SVG output HOT 13
- variables declared with `my` lead to errors HOT 1
- student answers get spaces normalized
- iframeResizer, feedback popover, and mqeditor HOT 15
- Updating AnswerFormatHelp.pl HOT 5
- Viewing all correct answers at the same time HOT 4
- PTX "image" tag getting changed to "img" HOT 5
- error with brace and x HOT 9
- PG editor not decoding as expecting HOT 1
- macros/graph/PGnauGraphics.pl doesn't use unique name, which can break tests. HOT 1
- securtiy issues with braces HOT 2
- MathQuill toolbar placement in a relatively positioned parent - bug when in an RTL course. HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pg.