且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Google图表API:将空行添加到时间轴?

更新时间:2023-11-14 20:40:16

似乎没有一些内置的方法可以为Google时间轴添加空条目。删除 rect 元素,通过编写一些额外的代码显示空白行

There does not seem to be some built-in way to add null entries to Google Timelines.But still you can remove the rect element which are showing blank row by writing some extra code

步骤1 为非工作员工添加相同日期值的开始日期和结束日期,以便蓝色矩形框具有最小宽度。

Step 1 Add start date and end date with same date values for non-working employee so that blue rectangular box would have minimum width.

第2步现在,因为对应于非工作雇员的矩形框具有最小宽度。因此,您可以添加此代码以消除所有 rect 元素的最小宽度

Step 2 Now since your rectangular box corresponding to non-working employee has minimum width. So you can add this code to disappear all rect element with minimum width

(function(){                                            //anonymous self calling function to prevent variable name conficts
    var el=container.getElementsByTagName("rect");      //get all the descendant rect element inside the container      
    var width=100000000;                                //set a large initial value to width
    var elToRem=[];                                     //element would be added to this array for removal
    for(var i=0;i<el.length;i++){                           //looping over all the rect element of container
        var cwidth=parseInt(el[i].getAttribute("width"));//getting the width of ith element
        if(cwidth<width){                               //if current element width is less than previous width then this is min. width and ith element should be removed
            elToRem=[el[i]];
            width=cwidth;                               //setting the width with min width
        }
        else if(cwidth==width){                         //if current element width is equal to previous width then more that one element would be removed
            elToRem.push(el[i]);        
        }
    }
    for(var i=0;i<elToRem.length;i++) // now iterate JUST the elements to remove
        elToRem[i].setAttribute("fill","none"); //make invisible all the rect element which has minimum width
})();

注意


只有确保有一些空白条目,因为它将
总是消失 rect 元素具有最小宽度无论是否
表示空白条目

Only use this code after making sure that there is some blank entry as it will always disappear rect element with minimum width no matter whether it represents blank entry or not

工作演示