README

描述

Highcharts 是一个用纯 JavaScript 编写的图表库，它提供了一种简单的方法将交互式图表添加到您的网站或 Web 应用程序中。Highcharts 当前支持线形、折线、面积、面积折线、柱形、条形、饼形、散点、角度仪表、面积范围、面积折线范围、柱形范围、气泡、箱形图、误差线、漏斗图、瀑布图和极坐标图等多种图表类型。更多信息请访问 Highcharts

安装

安装此扩展的首选方法是通过 composer。

要安装，请运行

$ php composer.phar require conquer/highcharts "*"

或添加

"conquer/highcharts": "*"

到您的 composer.json 文件的 require 部分。

用法

基本用法

// Form edit view
<?php
use conquer\highcharts\Highcharts;
?>
...
<?= Highcharts::widget([
    'options' => [
        'credits' => false,
        'chart' => [ 'type' => 'column' ],
        'title' => [ 'text' => 'Stacked column chart' ],
        'xAxis' => [
            'type' => 'datetime',
            'maxZoom' => 48 * 3600 * 1000,
        ],
        'yAxis' => [
            'min' => 0,
            'title' => [ 'text' => 'Total fruit consumption' ],
            'stackLabels' => [
                'enabled' => true,
                'style' => [
                    'fontWeight' => 'bold',
                    'color' => new JsExpression("(Highcharts.theme && Highcharts.theme.textColor) || 'gray'")
                ]
            ]
        ],
        'legend' => [
            'align' => 'left',
            'x' => 40,
            'verticalAlign' => 'bottom',
            'y' => 0,
            'floating' => false,
            'backgroundColor' => new JsExpression("(Highcharts.theme && Highcharts.theme.background2) || 'white'"),
            'borderColor' => '#CCC',
            'borderWidth' => 1,
            'borderRadius' => 10,
            'shadow' => false
        ],
        'tooltip' => [
            'headerFormat' => '<b>{point.x}</b><br/>',
            'pointFormat' => '{series.name}: {point.y}<br/>Total: {point.stackTotal}'
        ],
        'plotOptions' => [
            'column' => [
                'stacking' => 'normal',
                'dataLabels' => [
                    'enabled' => true,
                    'color' => new JsExpression("(Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white'"),
                    'style' => [
                        'textShadow' => '0 0 3px black'
                    ]
                ]
            ]
        ],
        'series' => [[
            'name' => 'John',
            'data' => [5, 3, 4, 7, 2],
            'pointStart' => new JsExpression('Date.UTC(2010, 0, 1)'),
            'pointInterval' => 24 * 3600 * 1000 // one day
        ], [
            'name' => 'Jane',
            'data' => [2, 2, 3, 2, 1],
            'pointStart' => new JsExpression('Date.UTC(2010, 0, 1)'),
            'pointInterval' => 24 * 3600 * 1000 // one day
        ], [
            'name' => 'Joe',
            'data' => [3, 4, 4, 2, 5],
            'pointStart' => new JsExpression('Date.UTC(2010, 0, 1)'),
            'pointInterval' => 24 * 3600 * 1000 // one day
        ]]
    ]
]); ?>

许可证

conquer/highcharts 在 MIT 许可证下发布。有关详细信息，请参阅附带 LICENSE.md 文件。