Incorrect Image Placement When Scrolling Excel Sheet

Incorrect Image Placement When Scrolling Excel Sheet

Posted by: hunghuynh9595 on 30 January 2024, 5:21 pm EST

• 

  hunghuynh9595

  • Post Options:
  • Link
    Copy
  • Jump To Answer

  Posted 30 January 2024, 5:21 pm EST

  I’m currently facing an issue when trying to insert an image into a specific position in my Excel sheet after scrolling. The image placement does not align correctly with the intended position. Here is a simplified version of the code:

  var sheet = spread.getActiveSheet();
  
  sheet.scroll(40, 0); // Scroll to a specific position
  
  sheet.pictures.add(“Image1”, “imagePath”, 388, 388, 85, 85);

• 

  ankit.kumar

  

  • Post Options:
  • Link
    Copy

  Posted 31 January 2024, 10:06 pm EST

  Hi,

  This is the expected behavior of the SpreadJS. The X and Y coordinates are calculated from the top and left of the sheet and not from the top and left of the viewport. This is the expected behavior.
  
  If you want to calculate from the top and left of the viewport, just add the heights and widths of the rows and columns not visible in the viewport.

  Kindly refer to the following code snippet and the sample:

  // Set Image with respect to current viewport x and y coorindate
  function setImageWRTCurrentViewPort(sheet, imageName, imageSrc, x, y, width, height) {
      let xC = 0;
      let yC = 0;
      let viewportTopRow = sheet.getViewportTopRow(1);
      let viewportLeftCol = sheet.getViewportLeftColumn(1);
      for (let i = 0; i < viewportTopRow; i++) {
          xC += sheet.getRowHeight(i);
      }
      for (let j = 0; j < viewportLeftCol; j++) {
          yC += sheet.getColumnWidth(j);
      }
      sheet.pictures.add(imageName, imageSrc, yC + x, xC + y, width, height);
  }

  Sample: https://jscodemine.grapecity.com/share/9o03i-dTmEOKezi1V8uIHQ/?IsEmbed=false&Theme=Unset&PreviewDirection=0&IsEditorShow=true&IsExplorerShow=true&IsPreviewShow=true&IsConsoleShow=true&IsRunBTNShow=false&IsResetBTNShow=false&IsOpenInCodemineBTNShow=false&PanelWidth=20&PanelWidth=50&PanelWidth=30&defaultOpen={"OpenedFileName"%3A["%2Fsrc%2Fapp.js"]%2C"ActiveFile"%3A"%2Fsrc%2Fapp.js"}

  References:

  getViewportTopRow method: https://developer.mescius.com/spreadjs/api/v17/classes/GC.Spread.Sheets.Worksheet#getviewporttoprow

  getViewportLeftColumn method: https://developer.mescius.com/spreadjs/api/v17/classes/GC.Spread.Sheets.Worksheet#getviewportleftcolumn

  Regards,

  Ankit

• 

  hunghuynh9595

  • Post Options:
  • Link
    Copy

  Posted 1 February 2024, 2:19 pm EST

  Thank you! My issue is resolved.