今天給大家介紹一個(gè)非常實(shí)用的PHP echarts例子，它可以通過(guò)極簡(jiǎn)的代碼實(shí)現(xiàn)各種圖表的創(chuàng)建和展示。Echarts是百度開(kāi)發(fā)的一個(gè)可視化數(shù)據(jù)展示工具庫(kù)，其命名源于"Enterprise Charts"（E企業(yè)級(jí)圖表），可以用于數(shù)據(jù)分析、可視化的數(shù)據(jù)展示等領(lǐng)域。下面我們就來(lái)詳細(xì)介紹一下使用PHP echarts例子的方法和注意事項(xiàng)。
首先，我們需要準(zhǔn)備好相關(guān)的工具和文件，這些文件可以從Echarts官網(wǎng)上下載或者通過(guò)CDN引用。如果你使用的是第二種方法，可以直接把下面這段代碼拷貝到你的網(wǎng)頁(yè)上：
https://cdn.bootcss.com/echarts/4.4.0-rc.1/echarts.min.js接下來(lái)，我們需要在代碼中先引用好這個(gè)文件。然后，在HTML中定義一個(gè)div的容器，并設(shè)置好相應(yīng)的樣式。例如這樣：
<style>#container { width: 100%; height: 300px; }</style><body><div id="container"></div></body>
代碼引用和div容器都設(shè)置好了，我們就可以通過(guò)PHP代碼來(lái)獲取數(shù)據(jù)并繪制echarts圖表。下面是一個(gè)簡(jiǎn)單的例子：
var myChart = echarts.init(document.getElementById('container'));myChart.setOption({title: { text: 'ECharts 入門(mén)示例' },xAxis: {data: ["周一","周二","周三","周四","周五","周六","周日"]},yAxis: {},series: [{name: '銷(xiāo)量',type: 'bar',data: [5, 20, 36, 10, 15, 20, 30]}]});
在上面的例子中，我們使用了bar類(lèi)型的圖表，數(shù)據(jù)的展示形式為柱狀圖，x軸表示一周的七天，y軸表示銷(xiāo)售量。數(shù)據(jù)來(lái)源可以是PHP代碼中直接輸出的json字符串，也可以從數(shù)據(jù)庫(kù)中獲取。這里先列舉一個(gè)PHP數(shù)組作為例子：
$data = array(array("day" => "周一", "sale" => 5),array("day" => "周二", "sale" => 20),array("day" => "周三", "sale" => 36),array("day" => "周四", "sale" => 10),array("day" => "周五", "sale" => 15),array("day" => "周六", "sale" => 20),array("day" => "周日", "sale" => 30),);
我們可以用json_encode()函數(shù)將上面的數(shù)組轉(zhuǎn)化為json字符串，再將其輸出：
$json = json_encode($data);echo '<script>var data = ' . $json . ';</script>';
最后將上面設(shè)置好的echarts動(dòng)態(tài)數(shù)據(jù)綁定上我們剛剛生成的JSON數(shù)據(jù)即可完成圖表的生成：
myChart.setOption({xAxis: { data: data.map(function (item) { return item.day; }) },series: [{name: '銷(xiāo)量',type: 'bar',data: data.map(function (item) { return item.sale; })}]});
以上便是PHP echarts例子的詳細(xì)介紹，通過(guò)簡(jiǎn)單的代碼就能夠輕松地生成各種圖表。希望這篇文章對(duì)大家有所幫助。