-1

In my current task, I'm animating the coordinates of SVG paths, so I'm trying to programmatically alter their values depending on an offset that the user changes. The coordinates are in ugly attributes whose values looks something like this:

M0,383c63,0,89.3,-14.1,117.4,-65.9...

For an offset of 100, the new value might need to look something like:

M0,483c63,0,89.3,-14.1,217.4,-65.9... // without the bold (it's just there to highlight diff)

I pass in different regular expressions for different paths, which look something like, say, /long(N)and...N...ugly(N)regex/, but each path has a different amount of captures (I can pass in that quantity too). Using the answers here and a loop, I figured out how to programmatically make an array of newly changed values (regardless of the number of captures), giving me something like ['483','217.4',...].

My question is, how do I programmatically replace/inject the altered numbers back into the string (as in the line above with the bolded numbers)?

My workaround for the moment (and a fiddle):

I'm generating a "reverse" regex by switching parens around, which ends up looking like /(long)N(and...N...ugly)N(regex)/. Then I'm doing stuff by hand, e.g.:

if (previouslyCapturedCount == 3) {
  d = d.replace(reverseRE, "$1" + dValuesAltered[0] + "$2" + dValuesAltered[1] + "$3" + dValuesAltered[2] + "$4");
} else if (previouslyCapturedCount == 4) {
  // and so on ...

But there's gotta be a better way, no? (Maybe due to my lack of JS skillz, I simply wasn't able to extrapolate it from the answers in the above linked question.)

Caveat: There are several questions here on S.O. that seem to answer how to do multiple replacements on specific pairs, but they seem to assume global replacements, and I have no guarantee that the matched/captured numbers will be unique in the string.
Community
  • 1
  • 1
Max Starkenburg
  • 1,499
  • 1
  • 15
  • 21

1 Answers1

1

Rather than making a huge complex pattern to find and replace everything you're looking for, I'd iterate each item and replace them one at a time. With a regex that looks like this:

In this regex the {1} is the number of comma delimited values you'd like to skip over. In this case we're skipping the first and replacing just the leading numbers in the second string.

^(,?[^,]*){1},([0-9]+)

Replace With the following, where _XX_ is the desired new value.

$1,_XX_
Ro Yo Mi
  • 14,790
  • 5
  • 35
  • 43
  • Bless you for answering my downvoted question (and giving an explication of things like {1}, which I hadn't seen in a while). I swear I tried to working on getting something based on your answer working, but even after a night's rest, it was making my not-a-programmer head hurt, haha, and even though this probably would have been a better starting point, since I already had the crazy regexes done, it was more effort than just going with my workaround for now. Perhaps I'll try again post-coffee. Again, thank you! – Max Starkenburg May 03 '16 at 10:47
  • So regarding you OP, you're saying that you have an offset of 100, then some subvalues in your string change. What is the criteria for deciding which subvalues get changed? Also, it sounds like you might have already landed on a solution, if so then you should post your solution as an answer to your own question. – Ro Yo Mi May 03 '16 at 12:27
  • The subvalues that are changed are rather arbitrary; I have to manually figure out which ones need changing after making the SVG (bleh). My "solution" to the reinjection problem in the OP is just the workaround (where I'm manually writing out `if (captureCount == 3) { ...` for each captureCount, instead of something more like a one-liner). I guess my larger/general question was whether it's possible, given a regex, to replace the captures with slightly altered values, programmatically. And I thought making that array got me halfway there (though maybe it was an unnecessary step). – Max Starkenburg May 03 '16 at 12:40
  • FWIW, I upvoted your answer as useful because it helps me think of completely different ways of doing things I need to do, ways I hadn't conceived of before. I'm still learning. – Max Starkenburg May 03 '16 at 13:26