Convert "pt" to "px" using regular expression

Question

In WYSIWYG editor, I have

<TABLE style="WIDTH: 162pt; BORDER-COLLAPSE: collapse" border=0 cellSpacing=0 cellPadding=0 width=216>

I can convert this to

<TABLE style="WIDTH: 162px; BORDER-COLLAPSE: collapse" border=0 cellSpacing=0 cellPadding=0 width=216>

using

"wysiwygdata".replace(/pt/g ,"px");

Is there any way to change associated value of pt to the value of px using regex.

162pt might be 162*96/72px.

Looking for your help.

@BoltClock: No, but you can with `String#replace` and a callback. :-) — T.J. Crowder, Dec 21 '10 at 06:59
96/72 came from http://stackoverflow.com/questions/139655/how-to-convert-pixels-to-points-px-to-pt-in-net-c — Nazmul, Dec 21 '10 at 07:10

T.J. Crowder · Accepted Answer · 2010-12-21T07:04:39.447

19

You can use a regular expression for this, where you feed a function into String#replace:

s = /* ...the data... */;
s = s.replace(/([0-9]+)pt/g, function(match, group0) {

    return Math.round(parseInt(group0, 10) * 96 / 72) + "px";
});

Live example

When you supply a function for the second argument of replace, it gets called for each match, with the complete match as the first argument, and then the value of any capture groups for subsequent arguments; the return value is used as the replacement. So above I'm using a capture group to capture the number, and then doing the math and returning the new string.

You might need or want to adjust the regex a bit to make sure it fits your data (possible spaces between the number and the units, possibly the i flag so it matches "PT" as well as "pt", etc.), but that's the fundamental approach.

edited Dec 21 '10 at 07:04

answered Dec 21 '10 at 06:59

T.J. Crowder

1,031,962
187
1,923
1,875

Nice, I don't remember ever seeing this actually being used – qwertymk Dec 21 '10 at 07:01
@BoltClock, @qwertymk: Thanks. Yeah, it's one of those seemingly-hidden features, people don't seem to use it much. I was totally blown away when I first saw it. – T.J. Crowder Dec 21 '10 at 07:03
Wonderful,what I was looking for. – Nazmul Dec 21 '10 at 07:04
Awesome! I didn't know one can pass a callback-function to `replace()`. – sjngm Dec 21 '10 at 07:06

score 0 · Answer 2 · answered Jun 25 '16 at 16:26

In addition to T.J. Crowder solution: Since pt values are often non-integer (for example 237.36pt) it would be very useful to change regexp to match numbers without and optionally with decimal point, otherwise this regexp match fraction part only (i.e. 36pt in our example) and callback will produce incorrect value. This regexp should fix that issue:

/([0-9]*\.?[0-9]+)pt/g

Convert "pt" to "px" using regular expression

2 Answers2