Is it possible to add x-scrolling?

[sarigai-geoair]

I am wondering if it is possible to enable x-scrolling in dc_datatable? I tried adding it using datatables.js after made a dc_datatables.datatable chart but it seems there is a conflict.

[gordonwoodhull]

You should be able to set the option on the underlying datatables object via .dt() ?

https://datatables.net/examples/basic_init/scroll_x.html

What kind of conflict are you describing? Do you mean an error?

[sarigai-geoair]

do you mean something like?

dataTable
        .dimension()
        .group()
        .columns()
        .dt({
                    "scrollX": true,
                    "autoWidth": true
                })

The conflict I mentioned is that the scroll function I added using .DataTable() was adding another data table

[gordonwoodhull]

Hi @sarigai-geoair, could you please try setting it with .options() so that it is set when DataTables initializes? Like what you have except options instead of dt.

(The above would replace the dt object, which is not what we want. I was mistaken about .dt() above - it retrieves the DataTables object but that's after rendering, too late.)

And yeah, you don't want to initialize DataTable over again.

[sarigai-geoair]

Thanks a lot! But it seems like .options() is not changing anything.

[gordonwoodhull]

Sorry! This library is incomplete. You might try dc-tableview instead.

https://github.com/karenpommeroy/dc-tableview

[sarigai-geoair]

Sure, Thank you so much! I really appreciate your time and advice.

[gordonwoodhull]

I just tried it for myself and I think it does work.

Please note that DataTables requires extra CSS to be set in order for horizontal scrolling to work. From the CSS tab on the documentation page you linked above:

    div.dataTables_wrapper {
        width: 800px;
        margin: 0 auto;
    }

Otherwise the div will expand to show the entire table, causing the whole page to scroll horizontally.

[sarigai-geoair]

Hi Gordon, it worked! Thank you!!! I think my css wasn't updated after I added the CSS for some reason, and I didn't check it. Sorry for the confusion, thank you !!!!!!

[gordonwoodhull]

That's great! Yeah, it's always tricky working with JS libraries that also require CSS changes.