|
 Blurring of images and font when enlarged |
| Posted by vijay prasad on Jan-12-2016 16:11 |
|
Hi,
I m using ChartDirector API to generate the 3D Pie chart image and embedding in a PDF
file, the pie chart jpg file is getting generated but, when you maximize/enlarge the PDF to
200 or 300 % resolution, the image is getting blurred. The same is happening when you
just enlarge the image.
Can you please advise, as we are planning to purchase official license for the same, once
the issue is resolved.
|
| Re: Blurring of images and font when enlarged |
| Posted by Peter Kwan on Jan-13-2016 02:27 |
|
Hi Vijay,
If the image is created as JPG, it is like a digital photograph. Like any other JPG file, it
may become blurred when zoomed in. To make it sharp, there are two methods:
(a) Instead of JPG, you can create the chart as PDF or SVG, which are vector graphics and
will be sharp even when zoomed in. You can then insert the PDF or SVG into your PDF file.
The text in the chart will then be sharp just like other text in your PDF file.
(b) If your PDF creation software does not support inserting PDF or SVG into a PDF file,
and only supports with bitmap images like JPG, then you may consider to create a chart
with larger number of pixels. Just like a digital photograph, an image with more pixels will
be sharper. For your case, you may consider to create a large JPG chart with large font
size, then insert it into PDF at higher resolution. For example, you can create a chart 1800
x 1200 in size with 30 pts font size, and insert it into PDF at 300 pixel per inch (which is
equivalent to around 2400 dpi in printing). In this case, the chart will be about 6 inches x 4
inches on paper, or occupied around 35% of an A4 page.
Hope this can help.
Regards
Peter Kwan |
| Re: Blurring of images and font when enlarged |
| Posted by vijay on Jan-13-2016 19:35 |
|
Hi,
I'm attaching the java file, that i have used to generate images, and also the generated
SVG file and JPG file.
There is a slight blur that is happening in the line that is connecting the label text in both
SVG file and JPG file.
I'm using ChartDirector v 5, is it something because of that.(old version)
If at least the line blur could be resolved, i can go ahead in using the JPG image in my PDF
Regards
Vijay
|
| Re: Blurring of images and font when enlarged |
| Posted by vijay on Jan-13-2016 20:20 |
|
Hi,
Also, can you please provide some sample java program to generate this image as PDF
file, so that i can also try embedding the same.
Regards
Vijay |
| Re: Blurring of images and font when enlarged |
| Posted by Peter Kwan on Jan-14-2016 02:45 |
|
Hi vijay,
In ChartDirector version 5, to create true vector graphics output, you would need to call
"BaseChart.enableVectorOutput" immediately after creating the chart object, otherwise the
SVG created will just be an encapsulation of bitmap graphics in the SVG format. So it is
like:
PieChart c = new PieChart(.........);
//for ChartDirector 5, must call enable vector output here
c.enableVectorOutput();
.... create chart as usual .....
c.makeChart("d:/aaaa.svg");
In ChartDirector version 6, enableVectorOutput is no longer needed. (The method is still
there for compatibility, but it has no effect.)
PDF output is a new feature in ChartDirector 6. It would not work in ChartDirector 5. In
ChartDirector 6, the code is:
//Output in PDF
c.makeChart("d:/aaaa.pdf");
Hope this can help.
Regards
Peter Kwan |
| Re: Blurring of images and font when enlarged |
| Posted by vijay prasad on Jan-14-2016 21:47 |
|
Thanks, the issue is resolved.
We would like to make a Trial run in production, before we actually purchase the
ChartDirector license, is there any license available for 30/60/90 Day Trial period.
Regards
Vijay |
| Re: Blurring of images and font when enlarged |
| Posted by Peter Kwan on Jan-14-2016 22:47 |
|
Hi Vijay,
I will forward your request to sales@advsofteng.net, You should receive an email response
shortly.
Regards
Peter Kwan |
| Re: Blurring of images and font when enlarged |
| Posted by vijay prasad on Jan-27-2016 21:18 |
|
Hi,
I'm facing a new issue, when i dynamically pass data to generate the pie charts.
In the earlier program i hard coded the data values and in attached program, i prepare the
data outside and pass it to chart director java program via List.
The issue is the exploded segments appear too farther and not like the earlier image i
attached in the thread.
Attached the latest image files and java program that i'm using.
Kindly help here.
Any updates on 30/60/90 days Trial version, as we would like to make a Trial run first.
Regards
Vijay
|
| Re: Blurring of images and font when enlarged |
| Posted by Peter Kwan on Jan-28-2016 01:11 |
|
Hi Vijay,
By default, the explosion distance is 25% of the radius, that is, the sector will be moved
out for a distance equal to 25% of the radius.
For your case, it seems your code explodes all sectors. If the pie only has 2 sectors, and
your code explode both of them, they will both move away from the center by 25% of the
radius, but in opposite direction. So they may move apart for 50% of the radius.
You can modify the explosion amount by using PieChart.setExplode. In our own "Exploded
Pie Chart" sample code we use the following code to only explode the sectors by 10 pixels:
//exploded all sectors by 10 pixels
c.setExplode(-1, 10);
In your code, you may use the same method and adjust the explosion amount to fit you
needs.
For the licensing issue, I think we have responded to you by email on Jan 14, 2016. I will
resend the email to you in 3 minutes.
Regards
Peter Kwan |
| Re: Issue when printing the SVG image |
| Posted by vijay on Mar-02-2016 22:18 |
|
Hi,
I generated SVG image of 3D pie chart using "c.enableVectorOutput();", and i'm embedding it in a PDF at run time.
When i paper print the PDF i'm getting a background black (i have captured and attached) for pie chart. Also, attached the normal PDF (SVG image is appearing fine).
Is it because, we are using un-registered version for our Trial run.
This issue is caused, only when i embed the image in PDF and print, normally printing the SVG image is appearing fine.
Please advise here.
Regards
Vijay
|
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Mar-03-2016 04:26 |
|
Hi vijay,
If the SVG works normally (try to view it using the Google Chrome browser), put the PDF does not work or does not print normally, it is likely to be due to issues in one of the followings:
(a) the software that creates the PDF
(b) the PDF viewer
(c) the printer driver or the printer
For me to diagnose the problem further, is it possible to attached the SVG and PDF in the post, or email to me at pkwan@advsofteng.net? I will try to view and print the PDF using various PDF viewers. If the PDF works normally in my computer, the issue is probably due to the PDF viewer or printer driver or printer. If the PDF shows the same issue as in your computer, I will try to produce another PDF using the SVG. If the other PDF works, the issue is likely to be cause by the software the produces the PDF.
Regards
Peter Kwan |
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-11-2016 18:05 |
|
Hi,
We have now purchased the license and is undergoing a trial run in prod.
We are facing a small issue, when the pie chart is rendering 100% as the label text.The Percentage value (100.0%) Label is too close to the pie chart border. Attached the image.
Is there any possibility to move this a bit apart. For other values, it is displaying fine and only 100% appears too close.
|
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Apr-12-2016 01:45 |
|
Hi vijay,
Is the chart created in SVG?
In SVG, the graphics is rendered by the SVG viewer (the browser if it is a web application). Different browsers can rendered the SVG slightly differently (just like different browsers can render the same web page differently). In particular, the text size may be different among browsers and also depends on the font, font size, and how large the SVG is displayed, etc..
For your case, you may consider to use a larger right margin for the labels. So in case the browser draws the text longer than expected by the server, there is still some margin as a buffer. (The longer than expected text causes the right side of the text to be closer to the pie, so we just need to adjust the right margin.)
c.setLabelStyle("Arial", 10).setMargin(2, 5, 2, 2);
Hope this can help.
Regards
Peter Kwan |
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-18-2016 20:01 |
|
Hi,
Thanks, the above solution worked.
Now i got a new problem to be solved.
I guess you are aware that we are generating a 3D SVG pie chart image and embedding it in a PDF generated via jasper at run time.
We are experiencing issues when printing the PDF, (already discussed in above thread), a background shade is appearing. (images also attached for reference)
However using the Office reader and Mozilla, did not get the background shade and PDF is printing fine with the pie chart image.
I guess this cannot be tweaked at the code level, since we are just generating a 3D pie chart image and embedding in the PDF and solution is to use the correct software that renders and prints the 3D pie chart image.
Customer wants to know, what are all the list of softwares that can print the PDF correctly with the image in an A4 size paper. (i found that this possible using Offie reader/mozilla/Microsoft edge)
Attached the PDF. Please let me know, whether this can be printed using any other softwares and especially using Adobe Acrobat (currently Acrobat is not printing)
We already have done a conversation regarding the above in the same thread few days back. Please refer to that also.
Regards
Vijay
|
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Apr-18-2016 21:49 |
|
Hi vijay,
Are you referring to the attached PDF? It seems that PDF is not generated by ChartDirector, but by another software. You may want to enquire the vendor of that software which other software can print the PDF.
In case you are not aware, PDF cannot support SVG or PNG or GIF or many common image formats. If you can insert those images into PDF, it is because the PDF generation software converts them into PDF native format. For your case, may be the PDF generation software does not convert the SVG into PDF native format correctly, and it creates PDF that the Adobe Reader cannot understand. You may want to contact the vendor that provides the PDF generation software to trouble-shoot this issue. (Explain to them the PDF created seems corrupted as it can be displayed by Office reader/Mozilla/Microsoft edge but not by Adobe Reader.)
ChartDirector version 6 can also outputs the chart in PDF native format directly. From our testing, the PDF generated by ChartDirector seems to be readable by the Adobe Reader and other PDF reader we have tested.
If your PDF generation software can support importing images in PDF native format, you may try to see if this can solve the problem.
Regards
Peter Kwan |
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-19-2016 19:24 |
|
Hi,
Referring to your reply on Jan-13-2016 02:27.
Also you can refer to the attached PDF in the last thread, for the position and size of pie chart image.
Below is the code that i m using for generating SVG image and inserting in to pDF at run time. can you please help how to make a high resolution 3D JPEG image here, so that it will not blur.
(3D SVG is causing issue while printing from Adobe reader)
I want to retain the size and position of pie chart (as in the earlier attached PDF).
public class ChartDirector
{
//Name of demo program
public String toString() { return "3D Pie Chart"; }
public int getNoOfCharts() { return 1; }
/**
* Creates the 3D pie chart based on the provided data
* @param chartData
* @param fileName
* @param bandList
*/
public void createChart(java.util.List chartData,String fileName,java.util.List bandList)
{
try{
// The data for the pie chart
String[] labels = new String[chartData.size()];
double[] data = new double[chartData.size()];
int[] colors =new int[chartData.size()];
for (int i = 0; i < data.length; i++) {
data[i] = new Double( chartData.get(i).toString());
labels[i] = chartData.get(i) +"%";
colors[i] = pickColor((String) bandList.get(i));
}
// Create a PieChart object of size 360 x 300 pixels
PieChart c = new PieChart(420, 330);
// Set the center of the pie at (180, 140) and the radius to 100 pixels
c.setPieSize(210, 190, 130);
double arg0 = 90;
c.setStartAngle(arg0);
// Add a title to the pie chart
c.addTitle("");
c.setJoinLine(1);
c.setColors2(Chart.DataColor, colors);
// Draw the pie in 3D
c.set3D(25,60);
c.setLabelFormat("{label}");
c.setData(data, labels);
c.setExplode(-1, 13);
c.enableVectorOutput();
c.makeChart(path+"/chartimg/"+fileName+".svg");
}
catch(Exception e)
{
errorLog.debug(e.getMessage());
}
}
private int pickColor(String bandAvailable) {
if(bandAvailable.contains(""))
return 0xD1D3D4;
return 0;
} |
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-19-2016 21:22 |
|
Hi,
In addition to the below, we are experiencing a minor issue with the image (attached), where two values overlap (1.9 % and 0.5 %), is it possible to move this a bit apart, so that it won't overlap.
Below is the code fragment..
c.setLabelStyle("PslxTextErgo", 25).setMargin(2, 5, 3, 3);
c.setLabelFormat("{label}");
c.setData(data, labels);
c.setExplode(-1, 13);
c.enableVectorOutput();
|
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-19-2016 21:42 |
|
Hi,
The production implementation for us is due in couple of days, and we have purchased the license also.
Can i have your contact no, and time to call you, if anything needed on an urgent basis.
Regards
Vijay |
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Apr-20-2016 01:14 |
|
Hi vijay,
ChartDirector supports an alternative layout method where the labels will be moved to avoid overlapping. See:
http://www.advsofteng.com/doc/cdjava.htm#sidelabelpie.htm
For your case, I suspect there must be a legend somewhere, otherwise people may not know what the various colors mean. Since the user must read the legend to understand the chart, you may consider to put the percentage in the legend box. For example:
http://www.advsofteng.com/doc/cdjava.htm#legendpie2.htm
With the label and percentage in the legend box, you may not even need the sector labels next to the sectors.
Regards
Peter Kwan |
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Apr-20-2016 02:08 |
|
Hi vijay,
If the code in your previous message is really the code you use to draw the pie chart, then the pie should look different. I have attached an image to show what the chart should look like. Notice the side of the pie, which should be gradient shaded. The color of the side surface is also lighter than the one in your PDF chart.
To confirm, you may open the SVG file created with ChartDirector using Google Chrome or any browser that can view SVG directly to see if the side surface is gradient shaded.
I suspect the PDF generation software you are using cannot handle the gradient shading, and generates incorrect PDF native graphics. May be you can try to disable the gradient shading in the chart to see if can allow the PDF to be generated correctly. The code is:
c.setSectorStyle(Chart.FlatShading);
To create high resolution JPG. There are two methods. One is to simply create a chart with more pixels. For example, instead of 420 x 330, you may use much larger number of pixels. You would need to increase the font size, line width, etc., proportionately. Just like a digital camera, more pixels mean high resolution. Another method is to use a third party library to render the SVG into JPG. In the past, some of our customers have used the Apache Batik library to do this. Apache Batik happens to be written in Java.
Regards
Peter Kwan
|
| Re: Issue when printing the SVG image |
| Posted by vijay on Apr-20-2016 20:22 |
|
Hi,
Thanks for your reply, but the customer wants the sector label next to the sectors.They do not want side label layout also.
The issue is orange (1.9%) and violet (0.5%) overlap, both the sector and the label value overlap each other and they appear joined togeather.
But the customer wants each sector to be exploded and moved a bit apart from each other.
Below is the code fragment, that we are currently using:
c.setLabelStyle("PslxTextErgo", 25).setMargin(2, 5, 3, 3);
c.setLabelFormat("{label}");
c.setData(data, labels);
c.setExplode(-1, 13);
c.enableVectorOutput(); |
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on Apr-21-2016 05:33 |
|
Hi vijay,
To explode a pie, it means to move the sectors away from the center. If the sectors are small, it is normal the distance between the sectors will be small after explosion. It is because when the sectors move away from the center, they will move apart. However, if the angles between the two sectors are very small, they will move apart slowly.
I have attached two examples with the same explode distance. For the small sectors, you can see 40% of the sectors are already outside the circle, so the explosion is already quite large. Still the gaps between the sectors are small, simply because the sectors are small.
For the labels, unluckily, ChartDirector only has two built-in labeling methods, which is the method you are using, and the method I suggested in my last message that will try to avoid the overlapping.
It is also possible for your code to adjust the label position by a small amount, but your code still need to determine where to move the labels to. To move a label of a sector, you may use Sector.setLabelFormat, where the format contains CDML xoffset and yoffset attributes to move the label.
For a document (such as web page), you can have unlimited text because the document can be as large as necessary to contain the text. However, for a chart, the size is very limited. If there is sufficient text, it is impossible to avoid overlapping. For example, in a pie chart, if the label must be close to the sectors, and there can be many sectors and the sectors can be small, no matter which method you choose, it is hard to avoid label overlapping in some cases.
Regards
Peter Kwan
|
| Re: Issue when printing the SVG image |
| Posted by vijay on May-10-2016 21:36 |
|
Hi,
To avoid the overlapping issue we followed http://www.advsofteng.com/doc/cdjava.htm#sidelabelpie.htm.
Now a small issue is raised with the label - "The edge of the line which has an angle is not smooth."
Attached the sample image with issue highlighted.
Below is the code that we are using to set the label.
c.setLabelLayout(Chart.SideLayout);
TextBox t = c.setLabelStyle("PslxTextErgo", 7);
t.setWidth(40);
t.setBackground(16777215);
c.setLineColor(Chart.SameAsMainColor, 0x000000);
t.setMargin(2, 5, 5, 5);
t.setFontColor(0);
c.setLabelFormat("{label}");
Is it possible to set it right.
Regards
Vijay
|
| Re: Issue when printing the SVG image |
| Posted by Peter Kwan on May-11-2016 00:18 |
|
Hi Vijay,
From previous message, I assume your code creates the chart as SVG, then another third party library is used to convert the SVG into PDF.
Would you mind to try the followings?
(a) Open the SVG with Google Chrome to see if there are similar issues.
(b) Open the PDF with Google Chrome (not Adobe PDF) to see if there are similar issues.
If the line joins are better in SVG or in PDF with Google Chrome, I suspect it is due to the rendering quality of the Adobe PDF viewer.
We have long noticed that the Adobe PDF viewer rounds the line width to integers, and for thin lines, it renders diagonal lines thinner than usual.
For example, suppose the configued line width is 1 pixel. In PDF, the document is normally not viewed in its "natural size", but can be zoomed or larger. So a 1 pixel line can become 1.6 pixels because the size is larger in PDF. The Adobe PDF viewer may render it as 2 pixels. For the diagonal line, if it is 2 pixels thick, the vertical height of the line segment (the vertical lines between the lower and upper border of the thick line segment) should be 2 / cos(45) = 2.828 pixels, but the Adobe PDF viewer seems to render it as 2 pixels in height, so the diagonal line ends up thinner than the horizontal line.
From experience, the Google Chrome renderer seems more accurate and so the line thickness for the horizontal and diagonal segments would appear the same.
If the above is the cause of the problem, unluckily, the issue currently cannot be solved on our site.
I noticed you are using a 7pt size, but the text on your image is much larger. This means the image is magnified. May be you can consider to create a larger chart with a larger font size, and insert it into PDF so that it does not need to magnify. If we can keep the line width thin in the PDF, this may help to avoid the Adobe PDF rendering issue.
Regards
Peter Kwan |
|
Forum Home
Search
Message List
Post Message
(vijay prasad)