Echarts-PHP is a PHP library that works as a wrapper for the Echarts js library (https://github.com/apache/echarts). Support Apache ECharts (incubating) from version 2.2.x to 5.x.
Welcome star ⭐️!
The recommended way to install Echarts-PHP is through Composer. Just run the composer command to install it:
composer require hisune/echarts-php- Class: ECharts
- __construct([string] $dist = '')
- addSeries(Series $series)
- addXAxis(XAxis $xAxis)
- addYAxis(YAxis $yAxis)
- setOption(array $option)
- getOption([array] $render = null, [boolean] $jsObject = false)
- setJsVar(string $name = null)
- getJsVar()
- render(string $id, [array] $attribute = [], [string] $theme = null)
- on(string $event, string $callback)
- Class: Config
- Theme
- PHPDoc for property
public ECharts::__construct([string] $dist = '')
- Param
distis your customer dist url.
// The most simple example
use Hisune\EchartsPHP\ECharts;
$chart = new ECharts();
$chart->tooltip->show = true;
$chart->legend->data[] = '销量';
$chart->xAxis[] = array(
'type' => 'category',
'data' => array("衬衫","羊毛衫","雪纺衫","裤子","高跟鞋","袜子")
);
$chart->yAxis[] = array(
'type' => 'value'
);
$chart->series[] = array(
'name' => '销量',
'type' => 'bar',
'data' => array(5, 20, 40, 10, 10, 20)
);
echo $chart->render('simple-custom-id');void ECharts::addSeries(\Hisune\EchartsPHP\Doc\IDE\Series $series)
use \Hisune\EchartsPHP\Doc\IDE\Series;
$series = new Series();
$series->type = 'map';
$series->map = 'world';
$series->data = array(
array(
'name' => 'China',
'value' => 100,
)
);
$series->label->emphasis->textStyle->color = '#fff';
$series->roam = true;
$series->scaleLimit->min = 1;
$series->scaleLimit->max = 5;
$series->itemStyle->normal->borderColor = '#F2EFF4';
$series->itemStyle->normal->areaColor = '#993399';
$series->itemStyle->emphasis->areaColor = '#993399';
$chart->addSeries($series);void ECharts::addXAxis(\Hisune\EchartsPHP\Doc\IDE\XAxis $xAxis)
use Hisune\EchartsPHP\Doc\IDE\XAxis;
$xAxis = new XAxis();
$xAxis->type = 'category';
$xAxis->data = array('Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec');
$chart->addXAxis($xAxis);void ECharts::addYAxis(\Hisune\EchartsPHP\Doc\IDE\YAxis $yAxis)
use Hisune\EchartsPHP\Doc\IDE\YAxis;
$yAxis = new YAxis();
$yAxis->type = 'value';
$chart->addYAxis($yAxis);void ECharts::setOption(array $option)
- Param
optionis ECharts option array to be set.
array|string ECharts::getOption([array] $render = null, [boolean] $jsObject = false)
- Param
renderis ECharts option array. - Param
jsObjectis whether or not to return json string, return PHP array by default.
$option = array (
'tooltip' =>
array (
'show' => true,
),
'legend' =>
array (
'data' =>
array (
0 => '销量',
),
),
// ...
)
$chart->setOption($option);$chart->legend->data[] = '销量';
$chart->yAxis[0] = array('type' => 'value');If you need to assign a value to an empty object, you can use StdClass, for example: $chart->yAxis = new \StdClass;
string Config::jsExpr(string $string)
// With 'function' letter startup
'axisLabel' => array(
// this array value will automatic conversion to js callback function
'formatter' => "
function (value)
{
return value + ' °C'
}
"
)// Or you can add any js expr with jsExpr
use \Hisune\EchartsPHP\Config;
'backgroundColor' => Config::jsExpr('
new echarts.graphic.RadialGradient(0.5, 0.5, 0.4, [{
offset: 0,
color: "#4b5769"
}, {
offset: 1,
color: "#404a59"
}])
');void ECharts::setJsVar(string $name = null)
- Param
nameis your customer js variable name. By default, js variable name will generate by random.
string ECharts::getJsVar()
$chart->setJsVar('test');
echo $chart->getJsVar(); // echo test
// var chart_test = echarts.init( ...string ECharts::render(string $id, [array] $attribute = [], [string] $theme = null)
- Param
idis your html dom ID. - Param
attributeis your html dom attribute. - Param
themeis your ECharts theme. - Return html string.
$chart->render('simple-custom-id2', array('style' => 'height: 500px;'));void ECharts::on(string $event, string $callback)
- Param
eventis event name, available:click,dblclick,mousedown,mousemove,mouseup,mouseover,mouseout - Param
callbackis event callback.
string Config::eventMethod(string $name)
- Param
nameis your js function name which to be run in event callback. - Return js string, eg: Config::eventMethod('test') => test(params);
use \Hisune\EchartsPHP\Config;
// Recommend standard
$chart->on('click', Config::eventMethod('console.log'));
// Or write js directly
$chart->on('mousedown', 'console.log(params);');Hisune\EchartsPHP\Config::$dist = 'your dist url';\Hisune\EchartsPHP\Config::$distType = 'common'; // '' or 'common' or 'simple'\Hisune\EchartsPHP\Config::$minify = false; // default is truestring Config::addExtraScript(string $file, [string] $dist = null)
- Param
fileis your extra script filename. - Param
distis your dist CDN uri.
Hisune\EchartsPHP\Config::addExtraScript('extension/dataTool.js'); // the second param is your customer dist urluse \Hisune\EchartsPHP\Config;
Config::addExtraScript('vintage.js', 'http://echarts.baidu.com/asset/theme/');
echo $chart->render('simple-custom-id', array(), 'vintage');For more detail visit: https://hisune.com/view/50/echarts-php-property-phpdoc-auto-generate
https://demo.hisune.com/echarts-php/
All the Echarts live demos present on https://echarts.apache.org/
MIT
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent