Image quality in HTML

Aspose.Diagram Product Family
1

I found that some images has poor quality when we save as HTML. Here is a sample project:
TestApp.zip (184.6 KB)

Steps to reproduce:

  1. Open project in VS
  2. Set a destination path and press the button
  3. In destination folder you will find html representation of a Visio file.

Here is a quality of the image (text) when we use Visio to save as html:
image.png (1.0 KB)

and here is when we use Aspose Diagram:
image.png (399 Bytes)

If you need more info, please let me know.

2

@mmdevelopment

We have logged this issue as DIAGRAMNET-52858 in our issue tracking system for the sake of further investigation. We will look into its details and keep you posted with the status of its correction. Please be patient and spare us some time.

We are sorry for the inconvenience.

3

The issues you have found earlier (filed as DIAGRAMNET-52858) have been fixed in this update. This message was posted using Bugs notification tool by philip.zhou

4

I have tested v22.6 and from my point of view the problem still exists. Quality of texts still are much worst comparing to Visio App. To reproduce the problem, you can still use TestApp I added to this post.
Should I set any specific option to have a good image quality?

If you need more info, please let me know.

5

@mmdevelopment

Now we added a Resolution setting in HTMLSaveOptions class. In this situation, we can set a bigger Resolution than the default value 96 to get more clear image by using “saveOption.Resolution = 192;”

6

I have set Resolution to 192 but I don’t see any difference. I also set higher value (692) but still no effect. Both images (with and without Resolution) are identical.

7

@mmdevelopment

We apologize for the inconvenience. Would you kindly share the generated images for our reference as well? We will reopen the ticket and proceed accordingly.

8

Here are files:
images.zip (118.2 KB)

Here is entire html file generated with Resolution 492:
html_with_image_resolution_492.zip (40.7 KB)

Basically this text looks bad:
image.png (2.2 KB)

When I generate html using Visio Application, then it is much better.
Html from Visio App.zip (85.3 KB)

9

@mmdevelopment

We have reopened the ticket for further investigation. We will soon inform you once we complete its investigation against recently provided information by you. Please spare us some time.

We are sorry for the inconvenience.

10

@mmdevelopment
I am very sorry. I modify and test the Diagram.Save method, but neglect the Shape.ToHTML method. So you can use Diagram.Save temporarily, and we will update Shape.ToHTML method in next release. Thank you for using our product and sorry for the inconvenience again.

11

I have tested this fix using Shape.ToHtml() method and I afraid that adding a Resolution property is not enough.
The problem is that when we increase Resolution then entire Visio image is larger. But when we save as html using Visio Application, then the quality of the image is good and the size of the image is normal.
To summarize:

  • when we use Aspose.Diagram without Resolution fix then quality is bad and image size is normal
  • when we use Aspose.Diagram with Resolution fix then quality is good but the image is much larger
  • when we use Visio Appliation then quality is good and image is normal.

Here are html files generated by Aspose and Visio Application:
By Aspose.Diagram with Resolution.zip (218.6 KB)
By Aspose.Diagram without Resolution.zip (40.7 KB)
By Visio Application.zip (84.4 KB)

Resolution was set to 300.

I would expect that using Aspose.Diagram to save html will produce a good quality image with the same size what Visio Application creates.

Here is a test project I use to generate html files:
TestApp.zip (173.5 KB)

If you need more info, please let me know

12

@mmdevelopment

Another ticket as DIAGRAMNET-52964 has been logged in our issue tracking system against your feedback. We will surely look into its details and let you know as soon as it is resolved. Please be patient and spare us some time.

We are sorry for the inconvenience.

13

@mmdevelopment
Because of some unresolved technical issues, we cannot improve image quality in normal size image now. But we can add CSS style to html to make it looks normal, for example if you set Resolution to 300, we can add style=“width: 33%;height: 33%;” to the img element of html file. If this solution can help you, we will add this workaround in the next version.
It looks like this: By Aspose.Diagram with Resolution style.zip (220.6 KB)

14

So I assume that this width and height will be calculated based on the resolution for example:

  • Resolution=300 will add 33%
  • Resolution =400 will add for example 30%
  • Resolution = 200 will add 40%
    Am I right?

Your sample html looks good so probably we can try with this workaround. Probably if we don’t set Resolution at all then width=33%; height=33% shouldn’t be added at all.

15

@mmdevelopment
Of course, it will be calculated based on the resolution, and if we don’t set Resolution there will change nothing as before. What you said is exactly what I want to do.

16

The issues you have found earlier (filed as DIAGRAMNET-52964) have been fixed in this update. This message was posted using Bugs notification tool by philip.zhou