CODEWITHSUNDEEP
javascriptexceljs
texas697
texas697

Reputation: 6427

Custom alignment in richText cells Exceljs

"exceljs": "^3.9.0"

I need to create a spreadsheet with cells that have 2 different values that looks like this. First value needs to be aligned left and second value needs to be aligned right. IMAGE

My result right now is: IMAGE

Here is my richText for the cells without "/"

    [
  {
    "font": {
      "size": 8,
      "name": "Arial"
    },
    "alignment": {
      "vertical": "middle",
      "horizontal": "distributed"
    },
    "text": "392.3 "
  },
  {
    "font": {
      "color": {
        "argb": "00c90a00"
      },
      "size": 8,
      "name": "Arial"
    },
    "alignment": {
      "vertical": "middle",
      "horizontal": "distributed"
    },
    "text": " -10%"
  }
]

And richText for cell with "/"

    [
  {
    "font": {
      "size": 8,
      "name": "Arial"
    },
    "alignment": {
      "vertical": "middle",
      "horizontal": "distributed"
    },
    "text": "392.3 "
  },
  {
    "font": {
      "size": 8,
      "name": "Arial"
    },
    "alignment": {
      "vertical": "middle",
      "horizontal": "distributed"
    },
    "text": " / "
  },
  {
    "font": {
      "color": {
        "argb": "00c90a00"
      },
      "size": 8,
      "name": "Arial"
    },
    "alignment": {
      "vertical": "middle",
      "horizontal": "distributed"
    },
    "text": " -10%"
  }
]

Is it possible to do what the first screenshot looks like?

Upvotes: 1

Views: 5252

Answers (1)

J. M. Arnold
J. M. Arnold

Reputation: 6849

Is it possible to do what the first screenshot looks like?

Yes, that is possible, though you're not able to align text differently in the same cell. It isn't doable with Excel itself and thus definitely not with ExcelJS! There are hundreds of articles asking the question about Excel, but one quote hits the nail on it's head:

Unlike Word, Excel does not have the concept of paragraphs within a cell. Horizontal and vertical alignment apply to a cell as a whole.

Quote taken from the User Hansv MVP from this thread.

You can approach the project via different roads, depending on which suits you the most:

  • Split the cells with the data. ExcelJS does has the .spliceRows() function, so you could use that (with RichText formatting on respective cells).
  • You could implement the logic for writing from the get-go, i.e. implement one part of the data in one cell, the next part in the cell after that and so on. Afterwards you're able to color the border to the neighboring data to your background color, thus vanishing it.
  • etc.

I highly suggest the second approach. In my opinion it should be the easiest solution as you can properly set up a "formatting logic" in the sense of being free with each values you're writing.

Upvotes: 1

Related Questions