回答編集履歴

1 微修正

karamarimo

karamarimo score 2179

2018/05/15 11:01  投稿

react-chartjs-2は知らないですが,調べてみると分かります
react-chartjs-2は知らないですが,単にchart.jsのreact用ラッパーなのでchart.jsについて調べればいいですね
> 1)ツールチップを表示させつづけさせて、(今はタップしないと表示されないので)
なおかつツールチップの色や位置をカスタマイズしたい
常に表示するならtooltipというよりはdata labelですね.
ということで[chartjs-plugin-datalabels](https://chartjs-plugin-datalabels.netlify.com/)という公式のプラグインがありますので,それを使うほうが(個人的には)いいと思います。
スタイルも色々指定できるようです.
[Options - chartjs-plugin-datalabels](https://chartjs-plugin-datalabels.netlify.com/options.html)
> 2)y軸のラベルを消したい(0, 50, 100, 150を消したい)
`scales.yAxes.ticks.display`を`false`にするとできます.
[javascript - Remove x-axis label/text in chart.js - Stack Overflow](https://stackoverflow.com/questions/23424123/remove-x-axis-label-text-in-chart-js)
[Axes - Chart.js documentation](http://www.chartjs.org/docs/latest/axes/#common-configuration)
質問文のコードをもとに改変しました.
[**CodeSandbox Demo**](https://codesandbox.io/s/209kyw5wq0)

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る