如何在瀑布图的融合图中禁用悬停 属性

How to disable hover property in fusion charts of water fall chart

我正在尝试使用 fusioncharts 的瀑布图 API。 我想禁用图表的悬停 属性。在这里您可以看到悬停时它在 "Variable Costs" 列上显示 "Variable Costs, $-156K"。

我正在使用以下配置-

      {
"chart": {
    "caption": "Total Profit Calculation",
    "subcaption": "Last month",
    "yAxisname": "Amount (In USD)",
    "numberprefix": "$",
    "connectordashed": "1",
    "sumlabel": "Total {br} Profit",
    "positiveColor": "#6baa01",
    "negativeColor": "#e44a00",
    "paletteColors": "#0075c2,#1aaf5d,#f2c500",
    "baseFontColor": "#333333",
    "baseFont": "Helvetica Neue,Arial",
    "captionFontSize": "14",
    "subcaptionFontSize": "14",
    "subcaptionFontBold": "0",
    "showBorder": "0",
    "bgColor": "#ffffff",
    "showShadow": "0",
    "canvasBgColor": "#ffffff",
    "canvasBorderAlpha": "0",
    "divlineAlpha": "100",
    "divlineColor": "#999999",
    "divlineThickness": "1",
    "divLineDashed": "1",
    "divLineDashLen": "1",
    "usePlotGradientColor": "0",
    "showplotborder": "0",
    "showXAxisLine": "1",
    "xAxisLineThickness": "1",
    "xAxisLineColor": "#999999",
    "showAlternateHGridColor": "0"
},
"data": [
    {
        "label": "Online sales",
        "value": "420000"
    },
    {
        "label": "Store Sales",
        "value": "710000"
    },
    {
        "label": "Total Sales",
        "issum": "1"
    },
    {
        "label": "Fixed Costs",
        "value": "-250000"
    },
    {
        "label": "Variable Costs",
        "value": "-156000"
    },
    {
        "label": "COGS",
        "value": "-310000"
    },
    {
        "label": "Promotion Costs",
        "value": "-86000"
    },
    {
        "label": "Total Costs",
        "issum": "1",
        "cumulative": "0"
    }
]
  }

您还可以在下面link查看数据和配置。 Waterfall Chart

请建议 fusioncharts API 方式(如果可能)禁用悬停 属性。也欢迎其他方式的解决方案。

只需向元素添加 css 规则即可禁用悬停事件。

Jquery 解决方案

$('div#chart-container-1 rect').css('pointer-events','none');

CSS解决方案

div#chart-container-1 rect {
    pointer-events: none !important;
}

注意:chart-container-1 是父 div 的 ID,它将图表包装在您提供的 link 中,您可以更改它以匹配您的 div。

!important 用于 css 因为元素有内联样式 pointer-events 并且它在规则中具有优先级,所以覆盖内联 属性 优先级 I使用过 !important

另请注意pointer-events:none 将删除所有鼠标事件,包括单击、悬停、鼠标输入、鼠标移出等。