# How to sort words alphabetically from a String?

**URL:** <https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767>\
**Category:** Coding Questions\
**Created:** [July 17, 2019, 9:47pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767 "2019-07-17T21:47:38Z")\
**Posts on this page:** 20\
**Page:** 6

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 15, 2020, 7:20am UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/102 "2020-07-15T07:20:17Z")

</div>

Thank you very much dear @jeremydouglass I will check out this exemple asap. Thank you for your precious help ! Best wishes  
L

---

<div class="post-metadata">

**Author:** ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)\
**Post date:** [July 22, 2020, 7:48am UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/103 "2020-07-22T07:48:37Z")

</div>

Very impressive thread and very impressive project with nice visuals here!

And great how much effort Jeremy puts into this. Thank you!

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 22, 2020, 8:49am UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/104 "2020-07-22T08:49:36Z")

</div>

Dear Chrisir,  
Thank you so much for your compliments even if I feel I don’t deserve them.  
Jeremy is amazingly patient and dedicated and he puts so much effort into this project  
that I really feel very much indebted and thankfull for his great help and also ashame not to understand better and faster what he spends a lot of time to explain me…  
Hope I 'll get it at the end and that this project will come true. All volunteers on this forum are great you included of course and I don’t miss to quote your names once I show my projects, I owe you a lot. Thanks! 🙏 🙏 🙏 ❤ ❤ ❤

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 22, 2020, 4:21pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/105 "2020-07-22T16:21:14Z")

</div>

> [@lolonulu](#):
>
> I don’t know how to lerp on the bezier curves

@lolonulu hope you are well – were you able to make any progress on this using the example that I shared?

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 22, 2020, 7:57pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/106 "2020-07-22T19:57:05Z")

</div>

Dear @jeremydouglass,  
Thank you for your message and for taking care so much. I played a bit with the example you’ve sent me yersteday, thank you very much for your help as usual. Unfortunately I worked today and couldn’t apply the example to my sketch, but I will tomorrow! I’ll let you know…

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 29, 2020, 1:56pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/107 "2020-07-29T13:56:45Z")

</div>

Dear @jeremydouglass,  
Sorry for not replying before, but I had a lot of work.  
In my main sketch when I use lerp(), the y positions act strangely and though I’ve been looking for a solution, I haven’t found a way to solve the problem…

1rst PIC without lerp() :

![BECKETT](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/3e997e73a3890e81663b37059373af07ebecfa96.jpeg)

2nd PIC with lerp() :

![BECKETT_LERP](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/5/5801e438a74882ae40a5f576df3b38a72396b619.jpeg)

Since then I rewrote the sketch and I thought about using lerp on the char instead of the words, but it turns to be difficult with hundreds of letters… But here at least lerp() works smoothly. What would be then the good solution to use a smooth lerp() function over the words please ?!! Thank you very much in advance. Best wishes,  
L

```auto
String[] words; // a list of words
PVector[] pos; // where each word is
PVector[] targets; // where each word is going
float arcLength;
float rad =200;
float w;
float theta;
String message;
String text;
int index;
String alphabet = "ABCDEFGHIJKLMNOPQRSTUVWXYZ, ";
String [] wordsList;
char [] c;
float [] originPositionsX = new float [alphabet.length()];
float [] originPositionsY = new float [alphabet.length()];

void setup() {
  size(1000, 1000);
  stroke(128);
  textSize(20);
  words = new String[] {
    "Lorem", "rolem"};

  message = join(words, " ");
  wordsList =split(join(words, " "), " ");
  pos = randomPos(11);
  targets = randomPos(11);
  textAlign(CENTER);
  c = new char [message.length()];
  for (int i=0; i<message.length(); i++) {
    c[i]=message.charAt(i);
  }
  for (int i=0; i<words.length; i++) {
    words[i] =words[i].replaceAll(",", "\\$*");
    println(words[i]);
  }
}

void draw() {
  background(0);
  translate (width/2, height/2);

  // targets
  for (int i = 0; i <message.length(); i++) {

    char currentChar = message.charAt(i);
    float w = textWidth(currentChar);
    arcLength +=w/2+15;
    float theta = PI+arcLength/rad;
    targets[i].x = cos(theta)*rad;
    targets[i].y = sin(theta)*rad;
  }
  for (int i = 0; i <message.length(); i++) {
    if (i <= words[0].length()) {
      rad=100;
    } else if (i > words[1].length()) {
      rad=100+50;
    }
    char currentChar = message.charAt(i);
    float w = textWidth(currentChar);
    arcLength +=w/2+15;
    float theta = PI/2+arcLength/rad;
    targets[i].x = cos(theta)*rad;
    targets[i].y = sin(theta)*rad; 
    pos[i].lerp(targets[i], 0.02);
    pushMatrix();
    fill(255, 0, 0, 64);
    //rect(targets[i].x, targets[i].y, 10, 10); 

    popMatrix();
  }
  // draw lines
  for (int i = 0; i <message.length(); i++) {

    String st = str(message.charAt(i)).toUpperCase();
    char upperCaseChar = st.charAt(0);
    index = alphabet.indexOf(upperCaseChar);
    if (index < 0)continue;
    if (originPositionsX[index] != 0 && originPositionsY[index] != 0) {
      pushMatrix();
      noFill();
      stroke(255, 200);
      strokeWeight(0.5);
      rect(pos[i].x, pos[i].y, 10, 10); 
      bezier(originPositionsX[index], originPositionsY[index], pos[i].x-50, pos[i].y+20, pos[i].x+80+noise(pos[i].x+800), pos[i].y-80, pos[i].x, pos[i].y);
      popMatrix();
    }
    originPositionsX[index] = pos[i].x;
    originPositionsY[index] = pos[i].y;
  }

  // draw words
  for (int i=0; i<message.length(); i++) {
    char currentChar = message.charAt(i);
    float w = textWidth(currentChar);
    arcLength=w/2+10;
    float theta = PI+arcLength/rad;
    pushMatrix();
    translate(pos[i].x, pos[i].y); 
    rotate(theta-PI);
    fill(255, 0, 0);
    textSize(30);

    text(c[i], 0, 0);
    popMatrix();
    arcLength+=w/2;
  }
}

// return a list of random positions on the canvas
PVector[] randomPos(int count) {
  PVector[] pos = new PVector[count];
  for (int i=0; i<message.length(); i++) {
    pos[i] = new PVector(0, 0);
  }
  return pos;
}

void mouseReleased() {

  reorder(0, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10);
  targets = randomPos(message.length());
}

void keyReleased() {
  if (key=='0') {
    reorder(0, 5, 9, 3, 4, 2, 10, 8, 7, 6, 1);
  } else if (key=='1') {
    reorder(10, 0, 8, 2, 7, 9, 3, 1, 4, 5, 6);
  } else if (key=='2') {
    reorder(1, 2, 5, 10, 4, 9, 6, 0, 7, 8, 3);
  } else if (key=='3') {
    reorder(0, 1, 10, 4, 3, 5, 7, 9, 8, 6, 2);
  } else if (key=='4') {
    reorder(9, 2, 0, 3, 4, 10, 1, 6, 5, 8, 7);
  } else if (key=='5') {   
    //c = sort(c);
    reorder(8, 3, 2, 4, 10, 6, 1, 0, 9, 5, 7);
  } else if (key=='6') {   
    reorder(7, 6, 2, 1, 4, 9, 5, 10, 0, 8, 3);
  }
}

void reorder(int... idx) {
  char[] nw = new char[message.length()];
  nw[0]=c[idx[0]];
  nw[1]=c[idx[1]];
  nw[2]=c[idx[2]];
  nw[3]=c[idx[3]];
  nw[4]=c[idx[4]];
  nw[5]=c[idx[5]];
  nw[6]=c[idx[6]];
  nw[7]=c[idx[7]];
  nw[8]=c[idx[8]];
  nw[9]=c[idx[9]];
  nw[10]=c[idx[10]];
  c = nw;

  PVector[] np = new PVector[message.length()];
  np[0]=pos[idx[0]];
  np[1]=pos[idx[1]];
  np[2]=pos[idx[2]];
  np[3]=pos[idx[3]];
  np[4]=pos[idx[4]];
  np[5]=pos[idx[5]];
  np[6]=pos[idx[6]];
  np[7]=pos[idx[7]];
  np[8]=pos[idx[8]];
  np[9]=pos[idx[9]];
  np[10]=pos[idx[10]];
  pos = np;
}

```

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 29, 2020, 7:36pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/108 "2020-07-29T19:36:41Z")

</div>

I just examined the code that you shared – not the one in your screenshots, but this:

![Screen Shot 2020-07-29 at 12.12.31 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/3/3ea973c8b5778d58c2d509c4ed890c3de56296da.png)

Your character-based resort lerping seems to be working fine. However, there are character positioning issues. The rectangles look fine, but the character alignment and spacing is awkward.

![Screen Shot 2020-07-29 at 12.13.36 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/8/8c2098720a738fdc6ce9fee5e280e350304f1e46.png)

I think this is due to a combination of:

1. not vertically centering your characters, and
2. not using a fixed-distance font

I’d recommend making these changes to setup:

```auto
  textFont(createFont("Monaco", 32));
  textAlign(CENTER, CENTER);

```

![Screen Shot 2020-07-29 at 12.20.10 PM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/e/edc8c025f2831245c2bad0cf09e56808e3407634.png)

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 29, 2020, 10:05pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/109 "2020-07-29T22:05:50Z")

</div>

Thank you very much @jeremydouglass thanks to you it looks much better, but there is an extra square standing for the comma. I tried to remove it but it stays on the screen (even if not in the console). I use this method:

```auto
for (int i=0; i<words.length; i++) {
    words[i] =words[i].replaceAll(",", "\\$*");
  }

```

The angle of each char is akward too! : 😭  
Do you think I should lerp on each char? Because in the original there are hundreds of letters!!! SORRY 😖 Thank you for your great help

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 30, 2020, 4:39pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/110 "2020-07-30T16:39:56Z")

</div>

Dear @jeremydouglass,  
I’ve solved the angle issue for each char, but I still get an extra rectangle corresponding to the trailing comma between the strings despite the fact I remove it using the appropriate method ?! Is there any way to remove it?! More important: is there a way to lerp between strings keeping track of the positions and angles for each char!!! Sorry I try my best but I lack knowledge+experience! Thanks a lot… Best, L

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 30, 2020, 11:02pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/111 "2020-07-30T23:02:54Z")

</div>

> [@lolonulu](#):
>
> Do you think I should lerp on each char? Because in the original there are hundreds of letters

I’m sorry, maybe I don’t understand this question, or what the amount of letters has to do with anything. You are positioning letters on the screen, then repositioning them. You want each letter to move to a new position, right? So, when you compute that position, you use lerp – for 4, or 40, or 40,000 positions. Isn’t that the whole idea?

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 30, 2020, 11:09pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/112 "2020-07-30T23:09:08Z")

</div>

> [@lolonulu](#):
>
> I still get an extra rectangle corresponding to the trailing comma between the strings despite the fact I remove it using the appropriate method ?!

In your example sketch you have three things – words, message, and wordList. They look like this:

> words: {“Lorem”, “rolem”}  
> join words with a space:  
> message: “Lorem rolem”  
> join words with a space, then split on spaces:  
> wordList: {“Lorem”, “rolem”}

When you draw word characters, you use `message`. It has a space in it, because you put it there. When you draw each character, one of the characters is a space.

In your draw lines loop, you might want to have something like “if the character is a space, continue”. You could also do that in your draw character text loop.

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 31, 2020, 6:19am UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/113 "2020-07-31T06:19:08Z")

</div>

Thank you ver much for your answers Jeremy. I mean that in this new sketch I manage to use the lerp method to change each letter position but in my main sketch I change each word position but don’t manage to use the lerp method!! And if I need to write an array of 100 string positions for words it’s better than one with 1000 char positions!!🤪 The question is if I want to use lerp over strings (100 positions) and ellipse+bezier curves chat should I do?! Thanks a lot

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 31, 2020, 6:20am UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/114 "2020-07-31T06:20:55Z")

</div>

Sorry for this question but thank you very much for your very clear answer and your patience…

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 31, 2020, 5:58pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/115 "2020-07-31T17:58:57Z")

</div>

> [@lolonulu](#):
>
> in my main sketch I change each word position

I think you may be confused about your main sketch. I can see that you are drawing the characters one at a time, each with their own positions (and not one word at a time with a word position), because they are curved. For example, the word “folly” is curved – each letter has its own position.

 ![Screen Shot 2020-07-31 at 10.56.59 AM](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/6/6f77b512e6d39ee62f2a00c43274c9f441242e47.jpeg)

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 31, 2020, 6:08pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/116 "2020-07-31T18:08:02Z")

</div>

oh I see, I mean that Imove the letter’s position but that the whole word with its letters move together. When the word folly move all its letters move together to a new location where they are also curved.But I can’t use lerp since it mess up all the positions?!

In the other sketch each letter move independantly one from the other smoothly and there I can use lerp. But Since I have 867 letters I won’t write 867 times, nw[0]=words[idx[0]];?!

```auto
void reorder(int... idx) {
  String[] nw = new String[words.length];
  nw[0]=words[idx[0]];
  nw[1]=words[idx[1]];
  nw[2]=words[idx[2]];
  nw[3]=words[idx[3]];
  nw[4]=words[idx[4]];
  words = nw;

  PVector[] np = new PVector[pos.length];
  np[0]=pos[idx[0]];
  np[1]=pos[idx[1]];
  np[2]=pos[idx[2]];
  np[3]=pos[idx[3]];
  np[4]=pos[idx[4]];
  pos = np;
}

```

There is certainly a way to use the lerp function in my main sketch without messing up the positions, but I don’t find the solution…Thank you very much for your help Jeremy

---

<div class="post-metadata">

**Author:** ![jeremydouglass](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jeremydouglass/32/20_2.png) [@jeremydouglass](https://discourse.processing.org/u/jeremydouglass)\
**Post date:** [July 31, 2020, 6:31pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/117 "2020-07-31T18:31:52Z")

</div>

If you have some words:

> “one for all”

```auto
[0, 1, 2]

```

then their characters:

```auto
['o', 'n', 'e', ' ', 'f', 'o', 'r', ' ', 'a', 'l', 'l']

```

could be identified by word id:

```auto
[0, 0, 0, -1, 1, 1, 1, -1, 2, 2, 2]

```

In fact, each letter could have an id based on initial position:

```auto
[0, 1, 2, -1, 3, 4, 5, -1, 6, 7, 8]

```

so to change the words around, you need a new order of ids:

```auto
[6, 7, 8, -1, 3, 4, 5, -1, 0, 1, 2]

```

= “all for one”

It seems like you want to do word-level manipulations, then produce a mapping of the new positions.

So you want something like this:

“one for all”

designated as [0, 1, 2]

and then you want to give the input [2, 1, 0]

and produce “all for one” – is that correct?

So the function should accept two things – a String, and an int word order number sequence – and it should return an int of the letter id order

```auto
int[] order1 = new int[] {0, 1, 2};
int[] origins = targetPositions("one for all", order1); 
println(origins);

```

> 0, 1, 2, -1, 3, 4, 5, -1, 6, 7, 8

```auto
int[] order2 = new int[] {2, 1, 0};
int[] targets = targetPositions("one for all", order2);
println(targets);

```

> 6, 7, 8, -1, 3, 4, 5, -1, 0, 1, 2

now you can find a target for each id, get the position of that target, and lerp to it.

```auto
for (int i=0; i<targets.length; i++) {
  PVector targetPos = posFromID(targets[i]);
  PVector pos = PVector.lerp(originPos[i], targetPos, amt);
}

```

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [July 31, 2020, 6:41pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/118 "2020-07-31T18:41:01Z")

</div>

Dear @jeremydouglass,  
It looks wonderful !! Exactly the solution I couldn’t find. Thanks a million, I’ll try to integrate it to my sketch asap! Thanks for your generosity and great dedication I feel very lucky and grateful. Best wishes, L

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [August 18, 2020, 1:43pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/119 "2020-08-18T13:43:40Z")

</div>

Dear @jeremydouglass,

Thank you very much again, but not sure I understand everything. When you wrote :

> Blockquote

So the function should accept two things – a String, and an int word order number sequence – and it should return an int of the letter id order

> Blockquote

So the function should look like this?

int targetPositions(String s, intidx) {

- String split in a list [0,1,2]

- PVector list of the positions of the words into the String list

- List of int origins + list of char [s.length()]

- Pvector list of the positions of the letters

- return origins the int of the letter id order  
}  
Sorry to be so slow to respond…  
Thanks a lot for your help.  
Best wishes,

L

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [August 28, 2020, 7:32pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/120 "2020-08-28T19:32:25Z")

</div>

Dear @jeremydouglass,

I have some questions: how come that blank space return -1?!  
I wonder if I should split the String into substrings ‘one’, ‘for’, ‘all’?  
Thank you very much for your help and patience.  
Best wishes,  
L

---

<div class="post-metadata">

**Author:** ![lolonulu](https://avatars.discourse-cdn.com/v4/letter/l/ad7895/32.png) [@lolonulu](https://discourse.processing.org/u/lolonulu)\
**Post date:** [November 29, 2020, 10:26pm UTC](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767/121 "2020-11-29T22:26:10Z")

</div>

Dear @jeremydouglass,  
I hope you are fine. I wanted to ask you a question: is posFromID is supposed to be a method?  
How in this method can I pass the id letter order?!  
Thanks a lot in advance for your answer. Sorry to bother you again with this old story, but I don’t find the answer…  
Best,  
L

[Previous page](https://discourse.processing.org/t/how-to-sort-words-alphabetically-from-a-string/12767.md?page=5)