I'm trying to use the print() function on a Highstock chart, but its not printing well when my chart is very large (almost full screen, for example 1800x1000 pixels),
The problem is that it prints over multiple pages, and also most part of the right half of the chart gets cut off...
Is there a way to resize the chart before printing (but not resize on screen), or is there some sort of "scale to fit page" functionality?
Basically I just want it to look nice on a4 / letter paper format.
Take a look at the exporting parameters here. You can specify scale and sourceWidth and sourceHeight. As for "look nice" you will have to play around with the sizes until you reach this subjective goal.
Related
Hello to the community,
I would have one more question on Highcharts. I am working closely with designers and they prefer to have charts given to them with a predefined height, width, and text size, in millimetres (not pixels). That is because ultimately these charts are going to be printed out in reports.
Right now designers enter the value they want for a specific chart in millimetres onto a spreadsheet, and I convert all that to px before making the chart.
To convert pixel to mm I use:
px = mm * DPI / 25.4 since 1in = 25.4 mm.
For point (pt) to pixel I use:
px = pt * DPI/72 since 1pt = 1/72th of 1in.
Where DPI is a variable given to me: usually 300.
However the font size tends to be much bigger than it should be (it looks like it is 20 pt on the chart when I want 12 pt), and the chart dimensions also seem to be wrong.
My first question: do my calculations look right? (I am afraid I am not much of an image expert).
My second question: would there be a way to specify chart dimensions in a different format than pixel when configuring a chart on Highcharts, by any chance?
Thank you so very much!
You can use some of the already existing converters to get those values, like: https://www.unitconverters.net/typography/millimeter-to-pixel-x.htm
You can use CSS to set parameters for the container that the chart is rendered inside, demo: https://jsfiddle.net/BlackLabel/vu41gdt6/
#container {
height: 15rem;
width: 15rem;
}
Consider use regular CSS units for the charts on you web app and change them only for printing needs.
API: https://api.highcharts.com/highcharts/chart.events.beforePrint
Useful article: Using cm/mm on the CSS of a web app that replicates paper interaction is a good practice?
fist off, if there is an exchange place more suitable for the question, please address me.
I'm designing some labels in gimp.
I created a A4 300dpi document and created the artwork, arranged them to use all the page. To measure the labels I create a rectangle with the "rectangle selection tool" and there one can inspect the size in cm:
I printed straight from gimp and to my surprise, the printed labels where smaller than designed. I assumed somehow someone along the line added margins to my already A4 document..
I tried saving to PDF and then printing the PDF, very similar results.
I'd say the difference is around 5%
What would be the appropriated method for printing exactly at the size I created the document ignoring any margins ??
I'm using Windows 10, HP ENVY 5010 and Gimp 2.10
In OpenLayers I use ol.style.Text to add a text label to federal states polygons. The states have names of different length and also polygons of different sizes. It looks like this:
Is it possible to only print the text marker if it fits inside its polygon (e.g. after zooming in)? For instance, in the above example Hessen, Thüringen, Sachsen and Bayern would be printed, but Rheinland-Pfalz, Saarland and Baden-Württemberg would be omitted because the text goes beyond its feature's geometry...
I know I can set the font property of an ol.style.Text to a particular size based on the resolution but this does not help here as text would still overlap the borders sometimes...
This is currently not possible with help from the library. But you can use CanvasRenderingContext2D#measureText() in your vector layer's stlyeFunction to get the width of the label, and compare that with the extent's width of the polygon at a certain resolution, and decide based on that whether to render or not. You can also get smarter than using the extent's width, but it is probably a good enough approximation for many cases.
We are using the Highchart bubble diagram, however when bubble x and y are on the same place in the diagram and bubble y is smaller there is no way to neither see nor much less click the smaller bubble.
Is there any way to plot the bigger bubbles first and then plot the smaller ones on top? Or a setting which says that smaller ones always are on top of the bigger ones?
Just sort the series data in descending order and pass it to the highcharts.
So that, the bigger bubbles will be plotted first and then the smaller ones, thereby the user will be able to hover on smaller as well as bigger bubbles.
Tried this in my project, and it's working perfectly fine !
I am printing some custom drawn charts on a fast Reports 4 databand.
The band has one text component and one picture component which I manipulate in the OnBeforePrint event to draw my charts using its canvas.
The problem is that the width of the charts may change drastically and go far beyond the page width and scaling/streching the charts to fit the page limits is not an option for the user.
I tried to make the page width grow to accommodate the graphics and it worked very well while visualizing, but I cannot print it since the user's printer only accepts A4 paper size.
So how can I split the report in smaller A4 pieces like the following image?
PS: the first image is the actual report output and the second one is the desired result.