DNA Writer

Translate words into a sequence of DNA bases and convert them back again.

Translate text to base sequence

Enter text to translate: or
Include non-coding DNA: ||
Show Color Sequence: ( A G C T )

Output:

Translate base sequence to text

Enter Sequence:
Show Color Sequence:

Output:

How it works

The code uses a simple look-up table (see below) where each letter in the English alphabet is assigned a unique three letter code. The three letters are chosen from the letters of the DNA bases: AGCT. Any unknown characters or punctuation are ignored.

More details: DNA Writer on MontessoriMuddle.org

Translation Table:

----

URL Parameters

To automatically load text or a sequence you can use the following url parameters.

text -- input text to convert to a nucleobase sequence.

For example, the url to input the text "Hello":

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello

seq -- to convert from a nucleobase sequence into text.

For example, the url to input the sequence "CGTCTAATCATCTGT" (which translates to "HELLO"):

https://earthsciweb.org/js/bio/dna-writer/index.html?seq=CGTCTAATCATCTGT

no_color -- to stop the showing of the translated color bars. Set to "1" for no show. Defaults to show the color bar (no_show=0):

For example, no color bar with the url to input the sequence "CGTCTAATCATCTGT" (which translates to "HELLO"):

https://earthsciweb.org/js/bio/dna-writer/index.html?seq=CGTCTAATCATCTGT&no_color=1

non_coding -- set to "0" (non_coding=0) to prevent the page from adding a small segment of non-coding nucleobased to the front and back end of the sequence when converting from text:

For example, to convert the text "hello" without the non-coding bases:

https://earthsciweb.org/js/bio/dna-writer/index.html?text=hello&non_coding=0

Embedding the Color Sequences

Since they are so pretty to look at, I've created a method of embedding only the colored nucleobase sequences into other webpages by including the page dna_embed.html into iframes. The bars at the top and bottom of this page are examples. The bar at the top of the page uses:

The options are:

text -- the text you want coded. For ease of use, underscores ("_") are used to delimit words by default:

For example, to convert the text "Hello Guys" use:

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello_Guys

With the iframe it looks like this:

Embedded, it looks like this:

link -- by default the sequence is created as a link that comes back to this page. To turn off this behavior set link to "none". It's set up so that if you click on any of the letters they switch to grey:

For example, using with the "Hello Guys" text:

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello_Guys&link=none

With the iframe it looks like this:

Embedded, it looks like this (try clicking on the letters):

title -- when the mouse hovers over the color sequence it shows the text that was converted into the sequence. However, you can have this show up as the letter sequence itself (title_txt=seq) or as any text you'd like (title=Example_1). Options:

seq - show the sequence:

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello_Guys&title=seq

[text] - use this as the title text. For example, using "Example 1" as the title (use underscores for spaces):

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello_Guys&title=Example_1

ncols -- Set the number of columns for the sequence tiles. The tiles will automatically wrap to the width of the window by default, but this gives a different type of control, and you're going to have to adjust the dimensions of your iframe.

For example, using 5 columns:

https://earthsciweb.org/js/bio/dna-writer/index.html?text=Hello_Guys&ncols=5

With the iframe it looks like this:

Embedded, it looks like this (try clicking on the letters):

----

Advertisement