ECharts 是一個強大的數據可視化庫，能夠幫助我們將數據以圖表的形式展現出來。而 ECharts 的數據格式是以 JSON 形式進行傳輸的，利用 Ajax 技術可以輕松實現異步加載數據并進行圖表展示。但是，在使用 ECharts 的過程中，有時會遇到跨域訪問的問題，本文就來探究 ECharts JSON 跨域的解決方法。

由于安全原因，客戶端的腳本無法直接訪問來自不同域的服務器上的數據。而在 ECharts 的使用中，我們經常需要向不同的服務器發起請求來獲取數據，并將其展示在圖表上。所以就會出現 ECharts 數據請求時跨域的問題。

解決 ECharts JSON 跨域的方法有多種，下面我們將介紹其中較為常見的兩種方法：

1. JSONP 方式

function getData() {
let script = document.createElement('script');
script.type = 'text/javascript';
script.src = 'http://localhost:8081/data.php?callback=showData';
document.head.appendChild(script);
}
function showData(data) {
let option = {
xAxis: {
type: 'category',
data: data.category
},
yAxis: {
type: 'value'
},
series: [{
data: data.value,
type: 'line'
}]
};
let chart = echarts.init(document.getElementById('chart'));
chart.setOption(option);
}

2. CORS 方式

$.ajax({
type: 'POST',
url: 'http://localhost:8081/data.php',
data: 'param1=value1¶m2=value2',
crossDomain: true,
xhrFields: {
withCredentials: true
},
success: function(data) {
let option = {
xAxis: {
type: 'category',
data: data.category
},
yAxis: {
type: 'value'
},
series: [{
data: data.value,
type: 'line'
}]
};
let chart = echarts.init(document.getElementById('chart'));
chart.setOption(option);
},
error: function(data) {
alert('請求失敗！');
}
});

以上就是關于 ECharts JSON 跨域的兩種解決方法，可以根據自己的情況選擇不同的方法，確保數據能夠正常加載并展示在圖表上。