エチャート円グラフ、リングチャート、デフォルトのズーム効果をキャンセルするマウスタッチの後

プロジェクトのシナリオ:

echarts を使用して円グラフを作成し、マウスが凡例に触れるとズーム効果を適用します。 高忠実度によると、この効果はキャンセルする必要があります。

問題の説明

問題 1: このズーム効果をキャンセルしたいので、echarts のドキュメントを参照します。 見つけた後、

let option={
 backgroundColor:"rgba(0,0,0,0)",
 color: datas.colors,
 grid: {
 bottom: "1%",
 top: "10"
 },
 series: [
 	{
 name: "", 
 type: "pie",
 radius: ["56%", "72%"],
 center: ["50%", "46%"],
 silent:'ture'//グラフィックがマウス・イベントに反応しないかどうか、デフォルトはfalseである。
 avoidLabelOverlap: false,
 legendHoverLink:false,
 label: { 
 show: false,
 position: "center",
 },
 labelLine: { 
 show: false ,
 },
 data:
 },
 ]
 };

series-pie. silent

グラフが応答せず、マウスイベントをトリガーしないかどうか、デフォルトは false で、これは応答し、マウスイベントをトリガーすることを意味します。

silent を使用した後、いくつかの問題が発生しました

問題の説明

silent を使用した後、ズーム効果はキャンセルされましたが、tooltip の効果もキャンセルされ、キャンセルの例をクリックするとズーム効果が現れました。

理由の分析:

series-pie. silent

グラフィックがマウスイベントに応答せず、トリガーしないかどうか、デフォルトは false、つまりマウスイベントに応答し、トリガーします。

マウスイベントに応答しないと述べていることに注意してください。つまり、ツールチップを残したい場合は、silentを使用できないということです。

解決策:

silentを使用できないため、ドキュメントを注意深く読み、別の方法を見つけました。

dart
 {
 name: "",
 clockwise: false, 
 type: "pie",
 radius: ["56%", "72%"],
 center: ["50%", "46%"],
 avoidLabelOverlap: false,
 legendHoverLink:false,
 // silent:true,サイレント解除
 emphasis:{//強調表示を使う
 disabled:false,
 scale:false,// 
 scaleSize:0,//ダイレクトセットnot 0の失敗を防ぐためだ。
 },
 label: { 
 show: false,
 position: "center",
 },
 labelLine: { 
 show: false ,
 },
 data: datas.dataArr
 },