12

チャート ツールチップ フォーマッタを使用するにはどうすればよいですか? ハイチャートに反応ラッパーを使用しています。
私は次のような設定をしています： 

const CHART_CONFIG = {
    ...
    tooltip:  
    {
        formatter: (tooltip) => {
            var s = '<b>' + this.x + '</b>';
            _.each(this.points, () => {
                s += '<br/>' + this.series.name + ': ' + this.y + 'm';
            });
            return s;
        },
        shared: true
    },
    ...
}

しかし、このキーワードを使用してチャート スコープにアクセスすることはできません。また、ツールチップ パラメータからポイントを取得することもできません。ありがとう

4

5 に答える 5

2

React コンポーネントをツールチップ自体の一部として使用するのに役立つ別の方法を次に示します。

const Item = ({name, value}) => <div> {name}: {value}</div>

const config = { 
  formatter(this) {
    const container = document.createElement("div");
    return this.points.map(point => {
      ReactDOM.render(
        <Item name={point.series.name} value={point.y}/>
      )
      return container.innerHTML
    }
  }
}
于 2018-05-24T08:50:14.653 に答える