Initial Zoom options for angular with HTML Rendering

GroupDocs.Viewer Product Family
1

Hello,

I’m currently working with the angular frontend with HTML rendering of the documents. Currently, the getFitToHeight and getFitToWidth functions currently return 100 which is invalid for some of the docx and pdf files. The page width and height are not retrieved from the GetViewOptions (although, it looks like that only works for JPG and PNG rendering) and the width and height are set to 0. What are the options to get the correct dimensions for docx and pdf files for the functions below:

    getFitToHeight() {
    /** @type {?} */
    const pageWidth = this.formatIcon && (this.formatIcon === "file-excel" || this.formatIcon === "file-image") ? this._pageWidth : this.ptToPx(this._pageWidth);
    /** @type {?} */
    const pageHeight = this.formatIcon && (this.formatIcon === "file-excel" || this.formatIcon === "file-image") ? this._pageHeight : this.ptToPx(this._pageHeight);
    /** @type {?} */
    const windowHeight = (pageHeight > pageWidth) ? window.innerHeight - 100 : window.innerHeight + 100;
    /** @type {?} */
    const offsetHeight = pageHeight ? pageHeight : windowHeight;
    return (pageHeight > pageWidth) ? Math.round(windowHeight * 100 / offsetHeight) : Math.round(offsetHeight * 100 / windowHeight);
}

getFitToWidth() {
    // Images and Excel-related files receiving dimensions in px from server
    /** @type {?} */
    console.log(this.formatIcon);
    const pageWidth = this.formatIcon && (this.formatIcon === "file-excel" || this.formatIcon === "file-image") ? this._pageWidth : this.ptToPx(this._pageWidth);
    /** @type {?} */
    const pageHeight = this.formatIcon && (this.formatIcon === "file-excel" || this.formatIcon === "file-image") ? this._pageHeight : this.ptToPx(this._pageHeight);
    /** @type {?} */
    const offsetWidth = pageWidth ? pageWidth : window.innerWidth;
    return (pageHeight > pageWidth && Math.round(offsetWidth / window.innerWidth) < 2) ? 200 - Math.round(offsetWidth * 100 / window.innerWidth) : Math.round(window.innerWidth * 100 / offsetWidth);
}
2

@rramsahoye

You can get page width and height as follows:

using (var viewer = new Viewer("source file"))
{
     var viewOptions = ViewInfoOptions.ForHtmlView();
     var info = viewer.GetViewInfo(viewOptions);
     Console.WriteLine($"page size: {info.Pages.First().Width} x {info.Pages.First().Height} px");
     var options = HtmlViewOptions.ForEmbeddedResources("output.html");
     viewer.View(options);
}

Later, you can handle width and height at client side. Please let us know if it helps.

3

image.png (22.8 KB)
I’m seeing this being returned where the pages height and width returned as 0.

4

@rramsahoye

Have a look at this screenshot.png (14.2 KB). We cannot reproduce the issue using API version 20.6.1. Can you please share following details and we’ll further look into this scenario:

  • Problematic PPTX file
  • Sample code or application
  • API version that you are using