RGraph 中水平条值为 0 时无法单击

unable to click when horizontal bar value is 0 in RGraph

我在 Angular 7 应用程序中使用 RGraph。

使用水平条形图时,当条形值为零时我无法点击。

我试过 tooltipsHotspotYonly: true 和 tooltipsHotspotXonly: true

如果有人对此有答案,请告诉我。

条形图有 工具提示 HotspotXOnly 来促进这一点。但是 HBar 没有这样的 属性 - 所以我在 - tooltipsHotspotYOnly 中添加了一个。替换 getShape() 函数是这样的:

//
// This function can be used to get the appropriate bar information (if any)
// 
// @param  e Event object
// @return   Appriate bar information (if any)
//
this.getShape = function (e)
{
    var mouseXY = RGraph.getMouseXY(e);

    //
    // Loop through the bars determining if the mouse is over a bar
    //
    for (var i=0,len=this.coords.length; i<len; i++) {

        var mouseX = mouseXY[0],  // In relation to the canvas
            mouseY = mouseXY[1],  // In relation to the canvas
            left   = this.coords[i][0],
            top    = this.coords[i][1],
            width  = this.coords[i][2],
            height = this.coords[i][3],
            idx    = i;



        // Recreate the path/rectangle so that it can be tested
        //  ** DO NOT STROKE OR FILL IT **
        if (properties.tooltipsHotspotYonly) {
            this.path(
                'b r % % % %',
                this.marginLeft, top, this.canvas.width - this.marginRight - this.marginLeft, height
            );
        } else {
            this.path(
                'b r % % % %',
                left,top,width,height
            );
        }

        if (this.context.isPointInPath(mouseX, mouseY)) {

            if (RGraph.parseTooltipText) {
                var tooltip = RGraph.parseTooltipText(properties.tooltips, i);
            }

            var indexes = RGraph.sequentialIndexToGrouped(idx, this.data);
            var group   = indexes[0];
            var index   = indexes[1];

            return {
                object: this,
                     x: left,
                     y: top,
                 width: width,
                height: height,
       sequentialIndex: idx,
               dataset: group,
                 index: index,
                 label:  properties.yaxisLabels && typeof  properties.yaxisLabels[group] === 'string' ?  properties.yaxisLabels[group] : null,
               tooltip: typeof tooltip === 'string' ? tooltip : null
            };
        }
    }
};

现在您可以:

  1. 如果您喜欢编辑 HBar 库,请在此处获取代码并 替换 RGraph.hbar.js 文件中的 getShape() 函数。

  2. 从这里下载更新的库:

    https://www.rgraph.net/tests/canvas.hbar/RGraph.hbar.js

    (它将保留到至少下一个版本可用 - 到那时 您可以从标准 RGraph 获取新的 HBar 库 下载:https://www.rgraph.net/download.html#stable )

  3. 等到 5.27 版本出来,tooltipsHotspotYOnly 选项它将成为 RGraph 的一部分(使用上面的 link)。