Display_option widget to mask one or more categories of a parameter inn dataset

32 views
Skip to first unread message

Yuandan Zhang

unread,
Jan 7, 2024, 8:26:36 AMJan 7
to locuszoom
 Hi
I re-state my question with some clarification, hope some one can offer a quick help. 

I have a parameter in a dataset with 4 levels (HIGH, MODERATE, LOW and MODIFIER), in my case, "impact" in dataset "assoc". I want to set up a "display_option" widget to hide/mask one or more levels to make the plot less busy. Below is the template of the widget I try to set up, unfortunately, it does not work, simply, I did not understand the mechanics how the widget works. I browsed locuszoom examples, this one is a very close example to my case, both interactive options and legends, could some experienced users have a look, advise me?



Yuandan  

            /*
            const impact_chooser = {
                //type: 'set_state',
                //type: 'filter_field',
                type: 'display_options',
                tag: 'assoc_study',
                color: 'green',
                button_html: 'Impact Filter',
                position: 'right',
                show_selected: false,
                button_title: 'Select impact level: ',
                custom_event_name: 'widget_set_assoc_study',
                layer_name: 'panels',
                default_config_display_name: 'All IMPACT',
                state_field: '{{namespace[assoc]}}impact',
                statuses: "hidden",
                options: [
                    { display_name: 'ALL', display: {filters: null},},
                    { display_name: 'HIGH', display: {filters: 'hidden'},},
                    { display_name: 'MODERATE', display: {filters: 'hidden'},},
                    { display_name: 'LOW',    display: {filters: 'hidden'} ,},
                    { display_name: 'MODIFIER', display: {filters: 'hidden'}, },
                ],
            };
            */

Andrew Boughton

unread,
Jan 7, 2024, 9:10:06 AMJan 7
to locu...@googlegroups.com
Hi there. Per my earlier reply, what version of Locuszoom are you using? Some changes were made in v14 that could affect whether the example you are showing would work.

Do you see any errors in the JS console?

I'd be very happy to help you, but answering these questions would make it easier to give you relevant advice.

-Andy Boughton

On Jan 7, 2024, at 8:26 AM, Yuandan Zhang <yuanda...@gmail.com> wrote:


--
You received this message because you are subscribed to the Google Groups "locuszoom" group.
To unsubscribe from this group and stop receiving emails from it, send an email to locuszoom+...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/locuszoom/f8d4a80b-44c6-4a60-91aa-09060584b80dn%40googlegroups.com.

Yuandan Zhang

unread,
Jan 7, 2024, 6:25:15 PMJan 7
to locuszoom
Hi Andy

thanks for reply. 
I am using version v0.13.3. 
here is the error message

index.js:72  TypeError: Cannot read properties of null (reading 'data_layers')
    at new mt (widgets.js:1417:45)
    at c.create (base.js:88:16)
    at index.js:68:44
    at Array.forEach (<anonymous>)
    at vt.initialize (index.js:66:21)
    at new vt (index.js:53:14)
    at Mt.initialize (plot.js:1220:24)
    at sources.js:36:18
    at Pt.call (d3@^5.16.0:2:14749)
    at Object.populate (display.js:291:32)

Andy Boughton

unread,
Jan 7, 2024, 8:39:59 PMJan 7
to locu...@googlegroups.com
Thanks.

Two notes: first, based on the JS there may be a section of your code that you are not showing that is causing a bug.  Possibly the code you use to modify the plot layout and apply your customizations?

1.  The Js console error says you are trying to modify data layers of <something>, but the thing you are trying to change isn’t found. JS is somewhat unusual in that even if your code is totally broken, the rest of the page will appear to load and run. It’s always a code idea to keep the js console open as problems may not always be obvious otherwise!
2. See this tutorial document for an example of syntax on the filters behavior: https://statgen.github.io/locuszoom/docs/guides/interactivity.html#filters-control-what-is-shown  Note that you need to specify the field of interest, and also what type of comparison.



-Andy Boughton



Reply all
Reply to author
Forward
0 new messages