TINYRAY WebLogo

Published October 29, 2015 11:50:21 PM  |  Last update October 29, 2015 11:54:29 PM

TINYRAY web-logo application generates the graphical representation, sequence logo image, of the conservation and variation of the regions in a given sequence motif described using Position Weight Matrix (PWM) motif model.

Each logo consists of stacks of letters, one stack for each residue position in the sequence. The overall height of the stack indicates the sequence conservation at that position, while the height of letters within the stack indicates the relative frequency of each amino acid or nucleotide at that position. In general, a sequence logo provides a richer and more precise description of, for example, a binding site, than would a consensus sequence. To obtain the PWM motif model of a given set of sequences, we recommend of using the HIGEDA algorithm (Thanh Le et al., 2010), or the MEME algorithm (Bailey et al., 2006). These motif finding algorithms automatically search for the sequence motif and produce the PWM motif model. PWM contains m rows and (n+1) columns, where m is the number of the based symbols representing the sequences, 20 amino acid letters or 4 nucleotide letters, and n is the motif length. The first column of PWM is for the background model (non-motif model). The element at row i, column j of PWM represents the probability that the ith symbol occurs either at a background position, j=0, or at position j, j > 0, of a motif occurrence. An example of PWM model of DNA sequence motif is given below:

A: 0.21 0.01 0.01 0.01 0.01 0.80 0.19 0.16 0.28 0.12 0.05 0.75 0.01 0.01
G: 0.27 0.95 0.97 0.13 0.12 0.02 0.36 0.56 0.48 0.02 0.86 0.12 0.02 0.01
C: 0.30 0.02 0.01 0.05 0.85 0.05 0.36 0.20 0.14 0.16 0.08 0.11 0.77 0.86
T: 0.22 0.02 0.01 0.81 0.02 0.13 0.09 0.08 0.10 0.70 0.01 0.02 0.20 0.12
This motif is of 13-residue length. The probabilities that the letters A, G, C and T occur by chance, non-motif model, are 0.21, 0.27, 0.30 and 0.22 respectively.

TINYRAY weblogo usage To generate the sequence logo of a PWM motif model, the simplest way is to visit the TINYRAY weblogo website, enter the PWM in the format as shown above, then select Draw command. The sequence logo of the motif will be displayed on the web page, as below:

TINYRAY WebLogo

TINYRAY weblogo - a web application module TINYRAY weblogo was developed to be easily plugged into other web applications. Just send a POST request to http://ws.tinyray.com/weblogo with the PWM content attached, the service will send back the sequence logo image in HTML format. Hence, you can integrate TINYRAY weblogo with your web applications using either server-side or client-side scripting approach. The details are as followings:

  • Server-side approach using PHP
    $weblogoURL = 'http://ws.tinyray.com/weblogo/';
    $txtMatrix ='A: 0.21 0.02 0.01 0.01 0.01 0.79 0.19 0.17 0.28 0.13 0.05 0.75 0.01 0.01
    G: 0.27 0.95 0.97 0.13 0.12 0.02 0.36 0.56 0.49 0.02 0.86 0.12 0.02 0.01
    C: 0.30 0.02 0.01 0.05 0.86 0.05 0.36 0.20 0.14 0.16 0.08 0.11 0.77 0.86
    T: 0.22 0.02 0.01 0.81 0.02 0.13 0.09 0.08 0.10 0.70 0.01 0.02 0.20 0.12';
    /* Note: affect of the following parameters removal:
          'mode' : a black-white logo image will be generated 
       'bgcolor' : a white-opaque logo image will be generated */
    $postParms = 'mode=color&bgcolor=f9f9f9&pwm='.urlencode($txtMatrix);
    $handle = curl_init();
    curl_setopt($handle,CURLOPT_URL, $weblogoURL);
    curl_setopt($handle,CURLOPT_FRESH_CONNECT, true);
    curl_setopt($handle,CURLOPT_CONNECTTIMEOUT, 5);
    curl_setopt($handle,CURLOPT_TIMEOUT,13);
    curl_setopt($handle, CURLOPT_POSTFIELDS, $postParms);
    curl_setopt($handle,CURLOPT_RETURNTRANSFER, true);
    $weblogo=curl_exec($handle);
    curl_close($handle);
    // send the image content back to your client
    echo($weblogo);
    
  • Server-side approach using C# (or .Net VB)
    Random rnd = new Random();
    string weblogoPath = "/weblogo/";
    string weblogoServer = "ws.tinyray.com";
    string weblogoURL = "http://" + weblogoServer + weblogoPath;
    string txtMatrix =
    @"A: 0.21 0.02 0.01 0.01 0.01 0.79 0.19 0.17 0.28 0.13 0.05 0.75 0.01 0.01
    G: 0.27 0.95 0.97 0.13 0.12 0.02 0.36 0.56 0.49 0.02 0.86 0.12 0.02 0.01
    C: 0.30 0.02 0.01 0.05 0.86 0.05 0.36 0.20 0.14 0.16 0.08 0.11 0.77 0.86
    T: 0.22 0.02 0.01 0.81 0.02 0.13 0.09 0.08 0.10 0.70 0.01 0.02 0.20 0.12";
    /* Note: remove 'mode=color' from 'postParms', below,
       to have black-white logo image */
    string postParms = "mode=color&pwm=" + Server.UrlEncode(txtMatrix);
    string strRequest = "POST " + weblogoPath + " HTTP/1.1\r\n" +
            "Host: " + weblogoServer + "\r\n" +
            "Connection: close\r\n" +
            "User-agent: tinyray request\r\n" +
            "Accept: text/plain,text/html\r\n" +
            "Content-Length: " + postParms.Length + "\r\n" +
            "Content-Type: application/x-www-form-urlencoded\r\n\r\n" +
            postParms;
    // Convert send data to bytes
    Byte[] bytesSend = Encoding.ASCII.GetBytes(strRequest);
    // send httpRequest header
    WebRequest request = HttpWebRequest.Create(weblogoURL);
    request.Method = "POST";
    request.ContentType = "application/x-www-form-urlencoded";
    request.ContentLength = bytesSend.Length;
    Stream dataStream = request.GetRequestStream();
    dataStream.Write(bytesSend, 0, bytesSend.Length);
    dataStream.Close();
    // get server response
    int buflen = 10240;
    byte[] byteData = new byte[buflen];
    int rsize = 1; string receive = "";
    try {
        WebResponse response = request.GetResponse();
        dataStream = response.GetResponseStream();
        while (rsize > 0) {
          if ((rsize = dataStream.Read(byteData, 0, buflen)) > 0) {
             receive += Encoding.ASCII.GetString(byteData, 0, rsize);
          }
        }
        dataStream.Close();
        response.Close();
    }
    catch (HttpException idontknow) { receive = idontknow.Message; }
    // send the image content back to your client
    Response.Clear(); Response.Write(receive); Response.End();
    /* NOTE: 'send httpRequest header' & 'get server response' 
       can be replaced by: 
      WebClient client = new WebClient();
      byte[] bret = client.UploadData(weblogoURL, "POST",
                           Encoding.ASCII.GetBytes(postParms));
      string receive = Encoding.ASCII.GetString(bret); */
    
  • Client-side approach using javascript
    var lntAjaxXmlObject = null;
    var weblogoURL = 'http://ws.tinyray.com/weblogo/';
    var txtMatrix =
    "A: 0.21 0.02 0.01 0.01 0.01 0.79 0.19 0.17 0.28 0.13 0.05 0.75 0.01 0.01\
    G: 0.27 0.95 0.97 0.13 0.12 0.02 0.36 0.56 0.49 0.02 0.86 0.12 0.02 0.01\
    C: 0.30 0.02 0.01 0.05 0.86 0.05 0.36 0.20 0.14 0.16 0.08 0.11 0.77 0.86\
    T: 0.22 0.02 0.01 0.81 0.02 0.13 0.09 0.08 0.10 0.70 0.01 0.02 0.20 0.12";
    /* Note: remove 'mode=color' from 'postParms', below,
       to have black-white logo image */
    var postParms = 'mode=color&pwm=' + encodeURIComponent(txtMatrix);
    lntAjaxXmlObject = GetHttpObject();
    lntAjaxXmlObject.onreadystatechange = function() {
      if (lntAjaxXmlObject != null && lntAjaxXmlObject.readyState == 4)
      { // show the sequence logo image
        document.write(lntAjaxXmlObject.responseText);
      }
    }
    lntAjaxXmlObject.open("POST", weblogoURL, true);
    lntAjaxXmlObject.timeout = 600000;
    lntAjaxXmlObject.setRequestHeader('Content-Type',
                               'application/x-www-form-urlencoded');
    lntAjaxXmlObject.setRequestHeader("Content-length",
                               postParms.length);
    lntAjaxXmlObject.setRequestHeader("Connection", "close");
    lntAjaxXmlObject.send(postParms);
    
    Using client-side approach, we may have to deal with the cross-site scripting (XSS) security problem. However, jquery version 1.5 and the latters can do the trick. Please google it or check back later for my posts regarding this issue.
web builder  tnWeb.1.54 – powered and hosted by tinyray