これは私のプロジェクトで発生した問題であり、普遍的なものではありません。この記事はバグを見つけるまでの過程を記録するだけです。
必要
上司: このプロジェクトでは、ビッグ データの大画面表示ページを追加する必要があります。
準備
echarts 公式 Web サイトのチュートリアルに従ってインストールしてインポートします。
npm install echarts --save
//引入包
import echarts from 'echarts';
//外部引入中国地图（echarts5没有内置地图）
import "./map/js/china.js";
//渲染
var myChart = echarts.init(document.getElementById("map"));
myChart.setOption(chartData);
バグ対応
実行後、コンテナは#map空であり、マップが表示されていないことがわかりました。コンソールにエラーは出ていません！
これは問題を引き起こしているのではないかと思い、別の方法でマップを導入しました。
//引入地图JSON文件
import chinaJson from './map/json/china.json'
//注册地图
echarts.registerMap('china',chinaJson)
まだ空白であり、エラーは報告されていないことがわかりました。echarts.getMap()登録した地図を印刷して返しますnull。地図がまったく登録されていないことが判明しました。それで、なぜ地図を登録できないのかを調べに行き、長時間探しましたが無駄でした。
その後、他のバージョンの組み込みマップもインストールしようとしましたが、結果は同じでした。後でechartsそれを印刷すると、そのバージョンがインストールしたものと一致していないことがわかりました。
その後、いくつか検索した結果、それが元のプロジェクトに導入されていたことが最終的にわかりましたecharts。
それはまだ去勢されたバージョンでしたecharts。。。
製品版に変更するとecharts正常に表示されるようになります。
やっと
一番の理由は、エラーや未使用機能のプロンプトが表示されないため、時間がかかりましたが、次回同様の問題が迅速に解決されることを願っています。T^T