reactjschartsdhtmlx

DHTMLX Gantt Chart with Reactjs doesn't show scroll

i'm using react ver 16.7.0 and DHTMLX Gantt ver 7.0.11, Standard Edition. The problem is scroll column is doesn't show in monitor 24" or more but it can show in my laptop monitor (14")

my layout code

gantt.config.grid_elastic_columns = true;

    gantt.config.columns=[
        {name:"text",       label:"Task name",      width: '*', min_width: 300, max_width: 1200, tree:true, },
        {name:"assignTo",   label:"Assign To",      align: "center", width: '*', min_width: 100, max_width: 1200, },
        {name:"start_date", label:"Start Date",     align: "center", width: '*', min_width: 100, max_width:200, },
        {name:"endDate",    label:"Date Line",      align: "center", width: '*', min_width: 100, max_width:200, },
        // {name:"duration",   label:"Duration",       align: "center" },
        {name:"budgetHour", label:"Budget Hour",    align: "center" },
    ];

    gantt.config.grid_width = 500;
    
    gantt.config.layout = {
        css: "gantt_container",
        cols: [
            {
            width: 500,
            min_width: 300,
        
            // adding horizontal scrollbar to the grid via the scrollX attribute
            rows:[
                {view: "grid", scrollX: "gridScroll", scrollable: true, scrollY: "scrollVer"}, 
                {view: "scrollbar", id: "gridScroll"}  
            ]
            },
            {resizer: true, width: 1},
            {
                rows:[
                    {view: "timeline", scrollX: "scrollHor", scrollY: "scrollVer"},
                    {view: "scrollbar", id: "scrollHor"}
                ]
            },
            {view: "scrollbar", id: "scrollVer"}
        ],
    };

in monitor 14" have scroll enter image description here

here in monitor 24" enter image description here

*i try in 19" monitor scroll is showed

Solution

  • fix just type

    gantt.config.scroll_size = 20;