Skip to content

feat: header and footer support image #2563

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 7 commits into
base: master
Choose a base branch
from
Open

feat: header and footer support image #2563

wants to merge 7 commits into from
+997 −24

Conversation

baian1
Copy link

@baian1 baian1 commented Oct 20, 2023 •
edited
Loading

Introduce additional functionalities to enable the use of images in headers and footers.

example code:

  const workbook = new Excel.Workbook()
  await workbook.xlsx.readFile('./example.xlsx')
  const sheet = workbook.getWorksheet(1)
  sheet.headerFooter.oddHeader = '&R&G image';
  const imageId = workbook.addImage({
    filename: './test.jpeg',
    extension: 'jpeg',
  })
  sheet.addHFImage(imageId, { id: 'HF', width: '15pt', height: '15pt' })

TODO：

  • fix: miss comment legacyDrawing (need help)

test xlsx compatibility

  • wps
  • office excel
  • libre office not support

@baian1
Copy link
Author

baian1 commented Nov 28, 2023

@Siemienik this feature is done. if you have time, please review it.

@Siemienik
Copy link
Member

Thank you, I report it as a candidate to 4.5.0 discussion: #2574

Usually I take PRs to review by thumbs up amount and from the candidates list.

@ghost
Copy link

ghost commented Dec 6, 2024

when can we expect this feature?

@Sarsewar
Copy link

Sarsewar commented Dec 24, 2024 •
edited
Loading

@baian1
Does this feature support retaining the existing header image? Currently, when we load and download the Excel file using ExcelJS, the header image is being removed. Will your feature or code ensure that the existing header image is preserved? Is there any alternative as of now to retain header image?

@Siemienik
If you are planning to release this in version 4.5.0(#2574), could you please share the expected release date?

Is there any way we can use this PR #2563 now as exceljs.min.js (browserify). If so, please guide me.

Look forward to hearing from you. Thank you in advance for your help & support.

@baian1
Copy link
Author

baian1 commented Dec 25, 2024

@Sarsewar Currently unable to read HF images; I will look into this issue when I have time over the weekend.

@Sarsewar
Copy link

@baian1 That would be really helpful. Thank you for your support.

Looking forward to hearing from you.

@baian1
Copy link
Author

baian1 commented Dec 28, 2024

@baian1 That would be really helpful. Thank you for your support.

Looking forward to hearing from you.

@baian1 baian1 closed this Dec 28, 2024
@baian1 baian1 reopened this Dec 28, 2024
@baian1
Copy link
Author

baian1 commented Dec 28, 2024

@Sarsewar I tested it, and it seems to be working normally. I've built the dist artifacts; you can test them using patch-package. If there are no issues, you can create your own branch and merge the PR, then publish your own package for use.
exceljs-dist.zip

@Sarsewar
Copy link

Thanks @baian1, I will test it and let you know. May I know which Exceljs version you have used to build dist artifacts.

Thank you for support.

@baian1
Copy link
Author

baian1 commented Dec 28, 2024 •
edited
Loading

@Sarsewar The artifacts is built using the 'pr' branch version 4.4.0

@Sarsewar
Copy link

@baian1 I attempted to use a PNG image in the header, but it did not work. I am working on loading an Excel (.xlsx) file using the provided dist/excel.min.js file and downloading it without performing any operations on the data. However, the downloaded Excel file contains errors, cannot be recovered, and fails to open.

Please find the attached Excel file and code for your reference. I look forward to your feedback.

Testing HeaderImage.zip

@baian1
Copy link
Author

baian1 commented Dec 28, 2024 •
edited
Loading

I'm sorry. Branch selection was wrong when building the code. Please try this. @Sarsewar
Testing.HeaderImage (2).zip
I can open the file with WPS.

@Sarsewar
Copy link

Sarsewar commented Dec 28, 2024 •
edited
Loading

@baian1 Same issue. Microsoft Excel Unable to open & repair the downloaded the file. I hope you have provided the correct min.js file.

@Sarsewar
Copy link

Sarsewar commented Jan 7, 2025

@baian1

I noticed that the provided JS file does not support comments when opened in Microsoft Excel. However, according to the official documentation, comments are supported, and this functionality works correctly in version 4.4.0.

Could you please verify this? If, as you mentioned, the min.js build is based on version 4.4.0, it should support comments.

Additionally, I wanted to highlight that existing header images are now supported in Microsoft Excel with this PR. Thank you for your valuable contribution!

Testing HeaderImage.xlsx

@baian1
Copy link
Author

baian1 commented Jan 11, 2025

@Sarsewar I messed up the relationship between comments and hfimage, and the issue has been fixed.

@Sarsewar
Copy link

@baian1 thanks. Let me try at my end. I will test it and let you know.

@Sarsewar
Copy link

@baian1 it is not working. I attempted to use Microsoft Excel and encountered the same issue. Kindly refer to the sheet provided in the previous comment for testing. Additionally, I tried using a different Excel file(which I can't share) that contained drawing shapes and comments; however, both were removed.

@baian1
Copy link
Author

baian1 commented Jan 11, 2025

@Sarsewar This is a compatibility issue. I don't have MS Office on my Mac and only tested with WPS. After I got home, I revised it and it can be opened with MS Office now. Moreover, I added two test cases. You can run pnpm mocha --require spec/config/setup spec\integration\pr\test-pr-2563.spec.js and check the generated test files spec\out\comments-headerImage.test.xlsx and spec\out\comments-headerImage-sheetimage.test.xlsx.

@baian1
Copy link
Author

baian1 commented Jan 11, 2025

There are still issues with drawing shapes. I will take a look when I am free tomorrow.

@Sarsewar
Copy link

Thank you, @baian1 , for your assistance. I look forward to hearing from you regarding shape drawings.

@baian1
Copy link
Author

baian1 commented Jan 12, 2025

@Sarsewar 2077 This PR has the features you need, and you can build your own branch and merge the PR.

@Sarsewar
Copy link

@baian1 Thank you for the update. I’m unsure how to merge this PR and #2077 into my branch without encountering merge conflicts. Are there any resources or guides available? I’ll review them and give it a try.

@baian1
Copy link
Author

baian1 commented Jan 12, 2025

I created a branch and merged the code. I simply tested shap and it worked properly. shap-hf-image2.
You'll have to solve more compatibility issues on your own.
For the content of Office XML, please refer to this document. You can also unzip the xlsx file and read the shape format in the drawing file for reference to solve the problem.
Good luck. @Sarsewar

@Sarsewar
Copy link

Thanks for the help @baian1. 🙌🏻

@Sarsewar Sarsewar mentioned this pull request Jan 13, 2025
Open
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
hacktoberfest-accepted
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@baian1 @Siemienik @Sarsewar