Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Open
sammyjava opened this issue Mar 5, 2022 · 2 comments

Comments

@sammyjava
Copy link

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
Copy link
Author

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
Copy link
Author

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant