在树jqgrid中显示sparkine [英] Showing sparkine in tree jqgrid

问题描述

我需要在jqgrid中显示折线图.因此，我遇到了这个问题

I need to show a line graph inside a jqgrid. So, I come across this question

在此问题中，它显示了我们可以轻松地在jqgrid单元中显示迷你图.我用了同样的东西，但有效 问题是我的是一个树状网格.因此，此处仅填充父节点，而不填充子节点.

Here in this question, it is shown how easily we can show sparkline graph in jqgrid cell. I used the same thing and it worked but the problem is mine is a tree grid. So, here only parent node are populating not the child nodes.

这是我的代码

 loadComplete: function () {
                var ts = this;
                if (ts.p.reccount === 0) {
                    $(this).hide();
                    emptyMsgDiv.show();
                } else {
                    $(this).show();
                    emptyMsgDiv.hide();
                }
                var index = getColumnIndexByName('col_chart');
                $('tr.jqgrow td:nth-child('+(index+1)+')').each(function(index, value) {
                var ar;
                    try {
                        var chartData = [];
                        var height;
                        height = $(this.innerHTML.split(','));
                        for(i=0;i<height.length;i++){
                            chartData.push(height[i]);

                        }

                        ar = chartData;
                        var largest = Math.max.apply(Math, ar);
                        if (ar && ar.length>0) {
                            console.log(ar);
                        $(this).sparkline(ar,{
                        type: 'line',

                        tooltipFormat: "{{y:value}}",});
                        }
                    } catch(e) { alert (true);}
                });
            } 

我通过使用控制台检查了一切，一切正常，并且未显示预期的图表.

I checked by using console everything is working fine as expected only chart is not shown.

有人可以告诉我这是怎么回事吗?

Can anyone please tell me what is wrong here?

推荐答案

我想sparkline在隐藏节点上不起作用.我建议您在treeGridAfterExpandRow回调或jqGridTreeGridAfterExpandNode事件处理程序内调用sparkline.如果从服务器动态加载节点，则可能存在另一个可能的问题.在这种情况下，应在loadComplete回调或jqGridLoadComplete事件中包含对sparkline的调用.

I suppose that sparkline don't work on hidden nodes. I'd suggest you to call sparkline inside of treeGridAfterExpandRow callback or jqGridTreeGridAfterExpandNode event handler. Another possible problem could exist if you loads the nodes dynamically from the server. In the case you should include call of sparkline inside of loadComplete callback or jqGridLoadComplete event.

更新:您的演示的修改 http://jsfiddle.net/adishri22/98yxbjgc/可以是以下内容: https://jsfiddle.net/OlegKi/98yxbjgc/3/

UPDATED: The modification of your demo http://jsfiddle.net/adishri22/98yxbjgc/ could be the following: https://jsfiddle.net/OlegKi/98yxbjgc/3/

我使用了treeGridAfterExpandRow的以下代码:

treeGridAfterExpandRow: function (options) {
    var $self = $(this), p = $self.jqGrid("getGridParam"),
        iCol = p.iColByName.sl, item, i, tr, $td, rowid,
        idName = p.localReader.id,
        children = $self.jqGrid("getNodeChildren", options.item);
    for (i = 0; i < children.length; i++) {
        item = children[i];
        rowid = item[idName];
        tr = $self.jqGrid("getGridRowById", rowid);
        $td = $.jgrid.getDataFieldOfCell.call(this, tr, iCol);
        try {
            $td.sparkline($.parseJSON(item.sl));
        } catch(e) {}
    }
}

这篇关于在树jqgrid中显示sparkine的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！