• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
1

Heat map in a box to represent level of disorder in a protein.

New Here ,
Mar 31, 2024 Mar 31, 2024

Copy link to clipboard

Copied

Hello everyone! I would appreciate any help you can offer! I have different proteins of different lengths, and I want to make representations of the level of disorder along the amino acid positions of the protein. I have tables with the values (from 0 to 1) of disorder in order for each aminoacid. For example, if I had a protein with four aminoacids with the first two being very disordered and the last two being not disordered, my set of values for that protein would look like [0.98, 0.99, 0.06, 0.07]. I want a script that, when I input this set, would produce a box with a width in pixels equal to the number of values (4 pixels for a protein of 4 aminoacids), and each column of pixels to be colored depending on the value (e.g. white if the value is low and black if the value is high, with greys in between), creating in this way a type of heatmap box representation of the protein where the color indicates the level of disorder. This is what I have so far but it isn't working. I don't know if I should approach this in a different way? I am new to JavaScript and Illustrator and don't know how to go about it, thank you in advance!

 

 

 

 

TOPICS
How-to , Scripting

Views

114

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Guide , Mar 31, 2024 Mar 31, 2024
function drawHeatmapBox (values) {
    var doc = app.activeDocument;

    // box
    var boxWidth = values.length;
    var boxHeight = 100;
    var rect = doc.pathItems.rectangle(- 100, 100, boxWidth, boxHeight);
    rect.stroked = true;
    rect.strokeWidth = 1;

    // columns
    for (var i = 0; i < values.length; i++) {
        var color = new GrayColor();
        color.gray = values[i] * 100;
        var column = doc.pathItems.rectangle(- 100, 100 + i, 1, boxHeight);
        column.stroked 
...

Votes

Translate

Translate
Adobe
Guide ,
Mar 31, 2024 Mar 31, 2024

Copy link to clipboard

Copied

function drawHeatmapBox (values) {
    var doc = app.activeDocument;

    // box
    var boxWidth = values.length;
    var boxHeight = 100;
    var rect = doc.pathItems.rectangle(- 100, 100, boxWidth, boxHeight);
    rect.stroked = true;
    rect.strokeWidth = 1;

    // columns
    for (var i = 0; i < values.length; i++) {
        var color = new GrayColor();
        color.gray = values[i] * 100;
        var column = doc.pathItems.rectangle(- 100, 100 + i, 1, boxHeight);
        column.stroked = false;
        column.fillColor = color;
    }
}

var values = [0.98, 0.99, 0.06, 0.07];
drawHeatmapBox (values)

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
New Here ,
Mar 31, 2024 Mar 31, 2024

Copy link to clipboard

Copied

LATEST

Thank you so much! You really helped me! 🙂

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines