vue+echartsチャートの使用に関する問題記録

// グリッド線を表示するかどうかを制御します splitLine: {
    show: false, //グリッド線を表示するかどうか//スタイルを変更する lineStyle: {
       color: '#ccc' // グリッド線の色を変更する}                            
},

x軸: [
              {
                  タイプ: 'カテゴリ',
                  境界ギャップ: false、
                  データ: ['1月'、'2月'、'3月'、'4月'、'5月'、'6月']、
                  軸線:{
                      線のスタイル:{色:"#ccc"}
                  },
                  軸目盛り: {
                    show: false // スケールを削除する},
                  axisLabel:{//フォント スタイルの変更show: true,//表示と非表示textStyle:{color:"#ccc"}
                  },
                  // グリッド線を表示するかどうかを制御します splitLine: {
                 show: false, //グリッド線を表示するかどうか//スタイルを変更する lineStyle: {
                     color: '#ccc' // グリッド線の色を変更する}                            
},
              }
          ]、
          y軸: [
              {
                  タイプ: '値',
                  名前: '(回)',
                  軸線:{
                      線のスタイル:{色:"#ccc",フォントサイズ:'16'}
                  },
                  軸目盛り: {
                    show: false // スケールを削除する},
              }
          ]、

//円のタイトルの中央のテキストのスタイルを変更します: {
          テキスト: value.value+'times',
          サブテキスト: 値.名前、
          x: '中心'、
          y: '中心'、
          アイテムギャップ: 0,
          テキストスタイル: {
            フォントサイズ: 26,
            フォントの太さ: '太字'、
            色: 'rgb(0,237,255)'
          },
          サブテキストスタイル: {
            フォントサイズ: 16,
            フォントの太さ: '太字'、
            色: '#fff'
          },
},
//マウスが連続して動くときに円のフローティング効果をクリアします: [
            {
              hoverAnimation:false, //この属性を追加します}
    ]

setOptionにtrueを追加する

オプション && myChart.setOption(option,true);

シリーズ： [
          {
            タイプ: 'パイ'、
            中央: ['50%', '49%'],
            半径: ['45%', '73%'],
            // 最小角度: 0,
            startAngle: 0, // グラデーション角度 AvoidLabelOverlap: true, // ラベルの重なりを防ぐかどうか emphasis: {
              ラベル: {
                表示: true、
                位置: '中央'
              }
            },
            データ: seriesData、
            アイテムスタイル: {
              強調：
                影ぼかし: 10,
                シャドウオフセットX: 0,
                影の色: 'rgba(0, 0, 0, 0.5)',
                ラベル: {
                  表示: true、
                }
              },
              普通： {
                color: function (params) { //カラーグラデーション var colorList = [
                    {
                      c1: '#3288FC',
                      c2: '#36B4FD'
                    },
                    {
                      c1: '#CBA0FF',
                      c2: '#598EFE'
                    },
                  ]
                  return new echarts.graphic.LinearGradient(1, 0, 0, 0, [{ //カラーグラデーション関数の最初の4つのパラメータは、それぞれ左、下、右、上の4つの位置を表します。オフセット: 0,
                    色: colorList[params.dataIndex].c1
                  }, {
                    オフセット: 1,
                    色: colorList[params.dataIndex].c2
                  }])

                }
              }
            }
          }
        ]