canvasXpress icon indicating copy to clipboard operation
canvasXpress copied to clipboard

Problem updating Manhattan plot data using CanvasXpress.updateData(data)

Open sammyjava opened this issue 3 years ago • 3 comments

Hiya! I've used updateData(data) to update a heatmap, and now I'm trying to do so with a Manhattan scatter plot. I have a selector that determines which data to plot, and I use a function to generate the plot, including the default when the page is first loaded. Here's how I'm updating the canvas:

     // create/update the CanvasXpress object
     var cx = CanvasXpress.$('canvasx');
     if (cx==null) {
         cx = new CanvasXpress('canvasx', data, conf, evts);
     } else {
         cx.updateData(data);
     }

The initial plot created with the constructor is fine (first attached image). However, when I change the selection, updateData() leaves a blue spinner on the plot, with no plotted data, and the legend gets "-log10(p) vs Manhattan" appended (second attached image). It seems like a bug! I've pasted the data, conf, evts below with the two data options.

     var evts = {
         "click": function(o, e, t) {
             var markerName = o.y.vars[0];
             var markerIdentifier = genome+"."+markerName;
             window.open("/"+"${WEB_PROPERTIES['webapp.path']}"+"/geneticmarker:"+markerIdentifier);
         }
     }
 
  var conf = {
     "decorations": {
         "line": [
             { "color": "rgb(0,0,255)", "width": 1, "y": 1.3 }
         ]
     },
     "graphType": "Scatter2D",
     "manhattanMarkerChromosomeNumber": "Chr",
     "manhattanMarkerLogPValue": "-log10(p)",
     "manhattanMarkerPosition": "Pos",
     "scatterType": "manhattan",
     "title": "Slide window with mouse; change scale with mouse wheel over axis; select region to zoom in; click marker to see its page.",
     "titleScaleFontFactor": 0.1,
     "disableToolbar": true,
     "colorBy": "Trait",
     "colorByShowLegend": true,
     "canvasBox": true,
     "setMinY": 0.0,
     "dataPointSize": 50,
     "legendBox": false,
     "legendScaleFontFactor": 2,
     "legendInside": false,
     "legendPositionAuto": false,
     "legendPosition": "right",
     "chromosomeLengths": [
         55915595,
         51656713,
         47781076,
         49243852,
         41936504,
         50722821,
         44683157,
         46995532,
         46843750,
         50969635,
         39172790,
         40113140,
         44408971,
         49711204,
         50939160,
         37397385,
         41906774,
         62308140,
         50589441,
         46773167
     ]
 }

data
{
    "z": {
        "Trait": [
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed oil",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein"
        ]
    },
    "y": {
        "smps": [
            "Chr",
            "Pos",
            "-log10(p)"
        ],
        "vars": [
            "ss715591641",
            "ss715591642",
            "ss715591644",
            "ss715591647",
            "ss715591649",
            "ss715594540",
            "ss715595353",
            "ss715595357",
            "ss715614263",
            "ss715621777",
            "ss715621779",
            "ss715621799",
            "ss715621801",
            "ss715621816",
            "ss715637225",
            "ss715637240",
            "ss715637283",
            "ss715637294",
            "ss715637299",
            "ss715637309",
            "ss715637315",
            "ss715637316",
            "ss715637318",
            "ss715637321",
            "ss715637329"
        ],
        "data": [
            [
                5,
                38495217,
                8.500312917381596
            ],
            [
                5,
                38495666,
                7.5003129173815966
            ],
            [
                5,
                38519280,
                6.1598939055432425
            ],
            [
                5,
                38543317,
                7.489454989793388
            ],
            [
                5,
                38569452,
                8.950781977329818
            ],
            [
                6,
                46040638,
                5.779891911959945
            ],
            [
                6,
                5591484,
                5.369572124974976
            ],
            [
                6,
                5660542,
                5.838631997765025
            ],
            [
                13,
                24858209,
                10.950781977329818
            ],
            [
                15,
                3828587,
                19.2298847052129
            ],
            [
                15,
                3833574,
                6.489454989793388
            ],
            [
                15,
                3918803,
                9.570247719997592
            ],
            [
                15,
                3919945,
                10.100179497572904
            ],
            [
                15,
                3967324,
                6.97061622231479
            ],
            [
                20,
                29594697,
                5.489454989793388
            ],
            [
                20,
                29983050,
                6.1598939055432425
            ],
            [
                20,
                30930931,
                10.349692476868064
            ],
            [
                20,
                31150279,
                30.939302159646388
            ],
            [
                20,
                31243150,
                32.27984069659404
            ],
            [
                20,
                31436069,
                7.8696662315049934
            ],
            [
                20,
                31580769,
                24.97881070093006
            ],
            [
                20,
                31610452,
                22.159893905543242
            ],
            [
                20,
                31640038,
                13.939302159646388
            ],
            [
                20,
                31687470,
                19.250263684430937
            ],
            [
                20,
                31972955,
                17.679853713888946
            ]
        ]
    }
}

data
{
    "z": {
        "Trait": [
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed oil",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed oil",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein",
            "Seed protein"
        ]
    },
    "y": {
        "smps": [
            "Chr",
            "Pos",
            "-log10(p)"
        ],
        "vars": [
            "ss715591641",
            "ss715591642",
            "ss715591644",
            "ss715591647",
            "ss715591649",
            "ss715594540",
            "ss715595353",
            "ss715595357",
            "ss715614263",
            "ss715621777",
            "ss715621779",
            "ss715621799",
            "ss715621801",
            "ss715621816",
            "ss715637225",
            "ss715637240",
            "ss715637283",
            "ss715637294",
            "ss715637299",
            "ss715637309",
            "ss715637315",
            "ss715637316",
            "ss715637318",
            "ss715637321",
            "ss715637329"
        ],
        "data": [
            [
                5,
                41855235,
                8.500312917381596
            ],
            [
                5,
                41854786,
                7.5003129173815966
            ],
            [
                5,
                41831154,
                6.1598939055432425
            ],
            [
                5,
                41807117,
                7.489454989793388
            ],
            [
                5,
                41780982,
                8.950781977329818
            ],
            [
                6,
                46572307,
                5.779891911959945
            ],
            [
                6,
                5597303,
                5.369572124974976
            ],
            [
                6,
                5666361,
                5.838631997765025
            ],
            [
                13,
                26343911,
                10.950781977329818
            ],
            [
                15,
                3846538,
                19.2298847052129
            ],
            [
                15,
                3851525,
                6.489454989793388
            ],
            [
                15,
                3936757,
                9.570247719997592
            ],
            [
                15,
                3937899,
                10.100179497572904
            ],
            [
                15,
                3985288,
                6.97061622231479
            ],
            [
                20,
                30744968,
                5.489454989793388
            ],
            [
                20,
                31129249,
                6.1598939055432425
            ],
            [
                20,
                21083902,
                10.349692476868064
            ],
            [
                20,
                32282623,
                30.939302159646388
            ],
            [
                20,
                32384035,
                32.27984069659404
            ],
            [
                20,
                32576952,
                7.8696662315049934
            ],
            [
                20,
                32721955,
                24.97881070093006
            ],
            [
                20,
                32752215,
                22.159893905543242
            ],
            [
                20,
                32781800,
                13.939302159646388
            ],
            [
                20,
                32835139,
                19.250263684430937
            ],
            [
                20,
                33121197,
                17.679853713888946
            ]
        ]
    }
}

Screenshot 2022-03-05 at 10-45-41 SoyMine GWAS mixed gwas Bandillo_Jarquin_2015 Screenshot 2022-03-05 at 10-45-01 SoyMine Report page

sammyjava avatar Mar 05 '22 18:03 sammyjava

I'm using the most recent CanvasXpress 37.8 given by

wget https://www.canvasxpress.org/dist/canvasXpress.css
wget https://www.canvasxpress.org/dist/canvasXpress.min.js

sammyjava avatar Mar 05 '22 18:03 sammyjava

Note: I also need to update conf because the chromosome lengths change, but that's a separate issue. I'd be fine with blowing away the canvasx object and replacing it, if that's an option. I get Javasacript errors when I simply try to replace it with a new constructor call.

sammyjava avatar Mar 05 '22 18:03 sammyjava