0

fusioncharts API のウォーター フォール チャートを使用しようとしています。グラフのホバリング プロパティを無効にしたい。ここでは、「変動費」列に「変動費、$-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"
    }
]
  }

次のリンクでデータと構成を確認することもできます。 ウォーターフォール チャート

ホバー時のプロパティを無効にする Fusioncharts API の方法 (可能であれば) を提案してください。他の方法のソリューションも大歓迎です。

4

1 に答える 1

0

要素に 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 でした。div に一致するように変更できます。

!importantpointer-events要素にはインラインスタイルがあり、ルールで優先されるため、cssで使用されます。使用したインラインプロパティの優先度をオーバーライドします!important

またpointer-events:none、クリック、ホバー、マウスイン、マウスアウトなどを含むすべてのマウスイベントが削除されることに注意してください.

于 2016-11-21T14:00:36.030 に答える