地域のカスタムカラーのためのechars 3Dマップソリューション

echartsMap を this.$echarts.init(this.$refs.echartsMap) とします。

this.$echarts.registerMap('河南', dataGeoLocation);
//後ろの dataGeoLocation は、ダウンロードして現在のコンポーネントに導入したマップの json ファイルであり、前の Henan は登録したいマップです。

 this.echartsDataMap = {
              ビジュアルマップ:
                最小: 0,
                最大: 500、
                表示: 偽、
                範囲内: {
                  色: ['#eac736', '#6EAFE3'].reverse()
                },

              },
              地球半径: 100,
              地球外半径: 100,
              ジオ3D:
                マップ: マップ名、
                ビューコントロール: {
                  中心: [0, 0, 0],
                  alpha: 100, // 上下回転角度beta: 10, // 左右回転角度animation: true, // アニメーションを表示するかどうかDurationUpdate: 1000, // アニメーション時間distance: 130, // ビューから被写体までの距離minBeta: -9999, // 最小 (左) 回転角度maxBeta: 9999, // 最大 (右) 回転角度autoRotate: false,
                  自動回転方向: 'cw',
                  自動回転速度: 10,

                },
                分割エリア:{
                  エリアスタイル:{
                    色: '赤',
                  }
                },
                ライト：
                  主要： {
                    強度: 1.2、
                    // 色: '透明',
                    色: '#0D3867',
                    影品質: 'ultra'、
                    影: 真、
                    アルファ: 150,
                    ベータ: 200
                  },
                  周囲:
                    強度: 1, // 周囲の光の強度},
                  アンビエントキューブマップ:
                    拡散強度: 1、
                    テクスチャ: ''
                  }
                },
                グラウンドプレーン:
                  表示:偽
                },
                ポストエフェクト: {
                  有効: false
                },
                アイテムスタイル: {
                  色: '#175096',
                  境界線の色: 'rgb(62,215,213)',
                  不透明度: 0.8、//透明度 borderWidth: 1
                },
                ラベル: {
                  表示:偽
                },
                強調：
                  ラベル: {
                    表示:偽
                  },
                  アイテムスタイル: {
                  }
                },
                silent: false, // マウスイベントに応答しない、またはトリガーしない},
              シリーズ： [
                {
                  タイプ: 'scatter3D'、
                  座標系: 'geo3D',
                  データ: this.areaName
                  シンボル: '円'、
                  シンボルサイズ: 0,
                  silent: false, // マウスイベントに反応しない、またはトリガーしない itemStyle: {
                    境界線の色: '#fff',
                    境界線の幅: 1
                  },
                  ラベル: {
                    距離: 30,
                    表示: true、
                    フォーマッタ: '{b}',
                    位置: '下'、
                    下: '100'、
                    テキストスタイル: {
                      色: '#fff',
                      マージン上: 40,
                      フォントサイズ: 16,
                      // フォントの太さ:'太字',
                      背景色: '透明'、
                    }
                  }
                },
                {

                  タイプ: 'scatter3D'、
                  座標系: 'geo3D',
                  データ: pinArr、
                  色: '#6EAFE3',
                  シンボル: 'ピン'、
                  シンボルサイズ: 56,
                  シンボルオフセット: ['100%','50%','0'],
                  silent: false, // マウスイベントに反応しない、またはトリガーしない itemStyle: {
                    テキスト配置: 'center'、
                    境界線の色: '#6EAFE3',
                    背景色: '#6EAFE3',
                    境界線の幅: 0
                  },
                  zレベル: -10,
                  ラベル: {
                    表示: true、
                    距離: -45,
                    // 左: -10,
                    位置: '下'、
                    フォーマッタ: (データ) => {
                      data.value[3] + ' 'を返します。
                    },
                    テキストスタイル: {
                      色: '#333',
                      背景色: '透明'
                    }
                  }
                },

              ]
            };

echartsMap.setOption(this.echartsDataMap);

地域:      
                {
                  名前: '鄭州市', /
                  アイテムスタイル: {
                      色: '緑'
                  }
                },{
                  名前:「南陽市」 
                  アイテムスタイル: {
                      色: '緑'
                  }
                },{
                  名前:「商丘市」
                  アイテムスタイル: {
                      色: '緑'
                  }
                }]