예제 #1
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('funnel')->data(array(array('category' => 'Awareness', 'value' => 4), array('category' => 'Interest', 'value' => 3), array('category' => 'Desire', 'value' => 2), array('category' => 'Action', 'value' => 1)));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'The AIDA model'))->addSeriesItem($series)->legend(array('position' => 'top'))->tooltip(array('visible' => true, 'template' => "#= category # - #= kendo.format('{0:P}', percentage) #"))->seriesDefaults(array("dynamicHeight" => false, "labels" => array("template" => "#= dataItem.category #", "visible" => true, "font" => "15px sans-serif", "align" => "center", "position" => "center", "background" => "transparent", "color" => "#000", "padding" => 5, "border" => array("width" => 1, "dashType" => "dot", "color" => "#000"), "format" => "N0")));
?>

    <div class="chart-wrapper">
        <?php 
echo $chart->render();
?>
    </div>
    <div class="configuration-horizontal">
        <div class="config-section">
            <span class="configHead">Show</span>
            <ul class="options">
                <li>
                    <label>
                        <input id="labels" checked="checked" type="checkbox" autocomplete="off" /> Show labels
                    </label>
                </li>
                <li>
                    <label>
                        <input id="showBorder" type="checkbox" checked="checked" /> Show border
                    </label>
                </li>
            </ul>
        </div>
예제 #2
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('pie')->data(array(array('category' => 'Football', 'value' => 35), array('category' => 'Basketball', 'value' => 25), array('category' => 'Volleyball', 'value' => 20), array('category' => 'Rugby', 'value' => 10), array('category' => 'Tennis', 'value' => 10)));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'What is you favourite sport?'))->addSeriesItem($series)->legend(array('position' => 'top'))->tooltip(array('visible' => true, 'template' => "#= category # - #= kendo.format('{0:P}', percentage) #"))->seriesDefaults(array('labels' => array('template' => "#= category # - #= kendo.format('{0:P}', percentage)#", 'position' => 'outsideEnd', 'visible' => true, 'background' => 'transparent')));
echo $chart->render();
?>
<div class="configuration-horizontal">
    <div class="config-section">
        <span class="configHead">Labels Configuration</span>
        <ul class="options">
            <li>
                <input id="labels" checked="checked" type="checkbox" autocomplete="off" />
                <label for="labels">Show labels</label>
            </li>
            <li>
                <input id="alignCircle" name="alignType" type="radio"
                       value="circle" checked="checked" autocomplete="off" />
                <label for="alignCircle">Aligned in circle</label>
            </li>
            <li>
                <input id="alignColumn" name="alignType" type="radio"
                       value="column" autocomplete="off" />
                <label for="alignColumn">Aligned in columns</label>
            </li>
        </ul>
    </div>
</div>
예제 #3
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('donut')->field('percentage')->categoryField('source')->explodeField('explode');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->data(array(array('source' => 'Hydro', 'percentage' => 22, 'explode' => true), array('source' => 'Solar', 'percentage' => 2), array('source' => 'Nuclear', 'percentage' => 49), array('source' => 'Wind', 'percentage' => 27)));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Break-up of Spain Electricity Production for 2008'))->dataSource($dataSource)->addSeriesItem($series)->legend(array('position' => 'bottom'))->seriesColors(array('#42a7ff', '#666666', '#999999', '#cccccc'))->tooltip(array('visible' => true, 'template' => '${ category } - ${ value }%'));
echo $chart->render();
require_once '../include/footer.php';
예제 #4
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_stock_prices();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('line')->field('close')->name('#= group.value # (close)');
$valueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$valueAxis->labels(array('format' => '${0}', 'skip' => 2, 'step' => 2));
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->field('date')->labels(array('format' => 'MMM'));
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$tooltip->visible(true)->format('{0}%')->template('#= series.name # - #= value #%');
$model = new \Kendo\Data\DataSourceSchemaModel();
$model->addField(array('field' => 'date', 'type' => 'date'));
$schema = new \Kendo\Data\DataSourceSchema();
$schema->model($model);
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'grouped-data.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->schema($schema)->addGroupItem(array('field' => 'symbol'))->addSortItem(array('field' => 'date', 'dir' => 'asc'));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Stock Prices'))->dataSource($dataSource)->legend(array('position' => 'bottom'))->addSeriesItem($series)->addValueAxisItem($valueAxis)->addCategoryAxisItem($categoryAxis)->seriesDefaults(array('type' => 'area'))->tooltip($tooltip);
echo $chart->render();
require_once '../include/footer.php';
예제 #5
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_stock_prices();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('scatterLine')->xField('date')->yField('close')->name('#= group.value # (close)');
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->labels(array('format' => 'MMM'));
$yAxis = new \Kendo\Dataviz\UI\ChartYAxisItem();
$yAxis->labels(array('format' => '${0}', 'skip' => 2, 'step' => 2));
$model = new \Kendo\Data\DataSourceSchemaModel();
$model->addField(array('field' => 'date', 'type' => 'date'));
$schema = new \Kendo\Data\DataSourceSchema();
$schema->model($model);
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'grouped-data.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->schema($schema)->addGroupItem(array('field' => 'symbol'))->addSortItem(array('field' => 'date', 'dir' => 'asc'));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Stock Prices'))->dataSource($dataSource)->legend(array('position' => 'bottom'))->addSeriesItem($series)->addXAxisItem($xAxis)->addYAxisItem($yAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #6
0
파일: date-axis.php 프로젝트: neevan1e/Done
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('column')->aggregate('avg')->field('value')->categoryField('date');
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->type('date')->baseUnit("weeks");
$dataSource = new \Kendo\Data\DataSource();
$dataSource->data(chart_date_points());
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->dataSource($dataSource)->addSeriesItem($series)->addCategoryAxisItem($categoryAxis);
echo $chart->render();
?>
<div class="configuration-horizontal">
    <div class="config-section">
        <span class="configHead">Base date unit</span>
        <ul class="options">
            <li>
                <input id="baseUnitAuto" name="baseUnit"
                        type="radio" value="" autocomplete="off" />
                <label for="baseUnitAuto">Automatic (default)</label>
            </li>
            <li>
                <input id="baseUnitYears" name="baseUnit"
                        type="radio" value="years" autocomplete="off" />
                <label for="baseUnitYears">Years</label>
            </li>
            <li>
                <input id="baseUnitMonths" name="baseUnit"
예제 #7
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$signal = new \Kendo\Dataviz\UI\ChartSeriesItem();
$signal->type('area')->data(array(20, 1, 18, 3, 15, 5, 10, 6, 9, 6, 10, 5, 13, 3, 16, 1, 19, 1, 20, 2, 18, 5, 12, 7, 10, 8))->line(array('style' => 'smooth'));
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->title(array('text' => 'time'))->majorGridLines(array('visible' => false))->majorTicks(array('visible' => false));
$valueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$valueAxis->max(22)->title(array('text' => 'voltage'))->majorGridLines(array('visible' => false))->visible(false);
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'A digital signal'))->legend(array('visible' => false))->addSeriesItem($signal)->addCategoryAxisItem($categoryAxis)->addValueAxisItem($valueAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #8
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_crime_stats();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('bubble')->xField('murder')->yField('burglary')->sizeField('population')->categoryField('state');
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$tooltip->visible(true)->format('{3}: Population {2:N0}');
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'remote-data-binding.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport);
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->labels(array('format' => '{0:N0}'))->title(array('text' => 'Murders per 100,000 population'));
$yAxis = new \Kendo\Dataviz\UI\ChartYAxisItem();
$yAxis->labels(array('format' => '{0:N0}'))->title(array('text' => 'Bulgraries per 100,000 population'));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->dataSource($dataSource)->legend(array('visible' => false))->addSeriesItem($series)->addXAxisItem($xAxis)->addYAxisItem($yAxis)->tooltip($tooltip);
echo $chart->render();
require_once '../include/footer.php';
예제 #9
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_wind_data();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$frequency = new \Kendo\Dataviz\UI\ChartSeriesItem();
$frequency->type('radarColumn')->stack(true)->field('frequency');
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->field('dirText');
$valueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$valueAxis->visible(false);
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'grouped-data.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->addGroupItem(array('field' => 'category'))->addSortItem(array('field' => 'dir', 'dir' => 'asc'));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Wind Rose'))->legend(array('position' => 'right', 'labels' => array('template' => '#= (series.data[0] || {}).categoryText # m/s')))->dataSource($dataSource)->seriesColors(array('#1b79e4', '#3b6ad3', '#5d5ac2', '#8348ae', '#a23a9d', '#c42a8c', '#e51a7a'))->addSeriesItem($frequency)->addCategoryAxisItem($categoryAxis)->addValueAxisItem($valueAxis)->tooltip(array('template' => '#= category # (#= dataItem.categoryText # m/s) #= value #%', 'visible' => true));
echo $chart->render();
require_once '../include/footer.php';
예제 #10
0
파일: index.php 프로젝트: neevan1e/Done
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('pie')->startAngle(150)->data(array(array('category' => 'Asia', 'value' => 53.8, 'color' => '#9de219'), array('category' => 'Europe', 'value' => 16.1, 'color' => '#90cc38'), array('category' => 'Latin America', 'value' => 11.3, 'color' => '#068c35'), array('category' => 'Africa', 'value' => 9.6, 'color' => '#006634'), array('category' => 'Middle East', 'value' => 5.2, 'color' => '#004d38'), array('category' => 'North America', 'value' => 3.6, 'color' => '#033939')))->labels(array('visible' => true, 'background' => 'transparent', 'position' => 'outsideEnd', 'template' => '#= category #: #= value#%'));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('position' => 'bottom', 'text' => 'Share of Internet Population Growth, 2007 - 2012'))->addSeriesItem($series)->legend(array('visible' => false))->tooltip(array('visible' => true, 'template' => '#= category # (#= series.name #): #= value #%'));
echo $chart->render();
require_once '../include/footer.php';
예제 #11
0
파일: index.php 프로젝트: neevan1e/Done
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('bubble')->data(array(array('x' => -2500, 'y' => 50000, 'size' => 500000, 'category' => 'Microsoft'), array('x' => 500, 'y' => 110000, 'size' => 7600000, 'category' => 'Starbucks'), array('x' => 7000, 'y' => 19000, 'size' => 700000, 'category' => 'Google'), array('x' => 1400, 'y' => 150000, 'size' => 700000, 'category' => 'Publix Super Markets'), array('x' => 2400, 'y' => 30000, 'size' => 300000, 'category' => 'PricewaterhouseCoopers'), array('x' => 2450, 'y' => 34000, 'size' => 90000, 'category' => 'Cisco'), array('x' => 2700, 'y' => 34000, 'size' => 400000, 'category' => 'Accenture'), array('x' => 2900, 'y' => 40000, 'size' => 450000, 'category' => 'Deloitte'), array('x' => 3000, 'y' => 55000, 'size' => 900000, 'category' => 'Whole Foods Market')));
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->labels(array('format' => '{0:N0}', 'skip' => 1))->axisCrossingValue(-5000)->majorUnit(2000)->addPlotBand(array('from' => -5000, 'to' => 0, 'color' => '#00f', 'opacity' => 0.05));
$yAxis = new \Kendo\Dataviz\UI\ChartYAxisItem();
$yAxis->labels(array('format' => '{0:N0}'))->line(array('width' => 0));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Job Growth for 2011'))->legend(array('visible' => false))->addXAxisItem($xAxis)->addYAxisItem($yAxis)->tooltip(array('visible' => true, 'format' => '{3}: {2:N0} applications', 'opacity' => 1))->addSeriesItem($series);
?>
<div class="chart-wrapper">
    <?php 
echo $chart->render();
?>
    <ul class="k-content">
        <li>Circle size shows number of job applicants</li>
        <li>Vertical position shows number of employees</li>
        <li>Horizontal position shows job growth</li>
    </ul>
</div>

<style scoped>
.chart-wrapper {
    position: relative;
}

.chart-wrapper ul {
    font-size: 11px;
예제 #12
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('bubble')->xField('growth')->yField('jobs')->sizeField('applications')->categoryField('company');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->data(array(array('growth' => -2500, 'jobs' => 50000, 'applications' => 500000, 'company' => 'Microsoft'), array('growth' => 500, 'jobs' => 110000, 'applications' => 7600000, 'company' => 'Starbucks'), array('growth' => 7000, 'jobs' => 19000, 'applications' => 700000, 'company' => 'Google'), array('growth' => 1400, 'jobs' => 150000, 'applications' => 700000, 'company' => 'Publix Super Markets'), array('growth' => 2400, 'jobs' => 30000, 'applications' => 300000, 'company' => 'PricewaterhouseCoopers'), array('growth' => 2450, 'jobs' => 34000, 'applications' => 90000, 'company' => 'Cisco'), array('growth' => 2700, 'jobs' => 34000, 'applications' => 400000, 'company' => 'Accenture'), array('growth' => 2900, 'jobs' => 40000, 'applications' => 450000, 'company' => 'Deloitte'), array('growth' => 3000, 'jobs' => 55000, 'applications' => 900000, 'company' => 'Whole Foods Market')));
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->labels(array('format' => '{0:N0}', 'skip' => 1))->axisCrossingValue(-5000)->majorUnit(2000)->addPlotBand(array('from' => -5000, 'to' => 0, 'color' => '#00f', 'opacity' => 0.05));
$yAxis = new \Kendo\Dataviz\UI\ChartYAxisItem();
$yAxis->labels(array('format' => '{0:N0}'))->line(array('width' => 0));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Job Growth for 2011'))->dataSource($dataSource)->legend(array('visible' => false))->addXAxisItem($xAxis)->addYAxisItem($yAxis)->tooltip(array('visible' => true, 'format' => '{3}: {2:N0} applications', 'opacity' => 1))->addSeriesItem($series);
?>
<div class="chart-wrapper">
    <?php 
echo $chart->render();
?>
    <ul class="k-content">
        <li>Circle size shows number of job applicants</li>
        <li>Vertical position shows number of employees</li>
        <li>Horizontal position shows job growth</li>
    </ul>
</div>

<style scoped>
.chart-wrapper {
    position: relative;
}
예제 #13
0
파일: index.php 프로젝트: neevan1e/Done
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('boxPlot')->data(array(array('lower' => 26.2, 'q1' => 38.3, 'median' => 51.0, 'q3' => 61.45, 'upper' => 68.90000000000001, 'mean' => 49.0, 'outliers' => array(18.3, 20, 70, 72, 5)), array('lower' => 26.4, 'q1' => 38.125, 'median' => 46.8, 'q3' => 60.425, 'upper' => 66.8, 'mean' => 47.3, 'outliers' => array(18, 69, 71.3, 71.5)), array('lower' => 31.6, 'q1' => 41.725, 'median' => 52.35, 'q3' => 62.175, 'upper' => 70.8, 'mean' => 52.3, 'outliers' => array(14, 16.4, 74)), array('lower' => 34.4, 'q1' => 39.375, 'median' => 49.9, 'q3' => 61.425, 'upper' => 69.2, 'mean' => 50.3, 'outliers' => array(16, 18, 72, 72.5)), array('lower' => 29.9, 'q1' => 38.35, 'median' => 50.4, 'q3' => 60.875, 'upper' => 69.7, 'mean' => 49.9, 'outliers' => array(19, 20, 76, 78)), array('lower' => 22.3, 'q1' => 36.875, 'median' => 48.9, 'q3' => 62.65, 'upper' => 70.3, 'mean' => 49.0, 'outliers' => array(16.5, 17, 74, 75, 78)), array('lower' => 32.3, 'q1' => 39.5, 'median' => 54.1, 'q3' => 61.175, 'upper' => 67.3, 'mean' => 50.8, 'outliers' => array(13, 14, 15, 74.3, 75.2, 76)), array('lower' => 28.5, 'q1' => 36.075, 'median' => 50.5, 'q3' => 64.2, 'upper' => 70.40000000000001, 'mean' => 49.6, 'outliers' => array(18, 22, 73.40000000000001, 75)), array('lower' => 33.6, 'q1' => 40.65, 'median' => 49.55, 'q3' => 62.8, 'upper' => 69.2, 'mean' => 51.1, 'outliers' => array(17, 73)), array('lower' => 33.6, 'q1' => 38.6, 'median' => 47.9, 'q3' => 60.825, 'upper' => 67.0, 'mean' => 49.7, 'outliers' => array(12, 13.5, 16, 73, 74.59999999999999, 77)), array('lower' => 31.9, 'q1' => 36.425, 'median' => 49.3, 'q3' => 61.825, 'upper' => 69.7, 'mean' => 49.4, 'outliers' => array(17, 76)), array('lower' => 34.0, 'q1' => 41.225, 'median' => 51.15, 'q3' => 62.4, 'upper' => 68.8, 'mean' => 51.6, 'outliers' => array(14.6, 17.3, 72.3, 74))));
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->categories(array("Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"))->majorGridLines(array('visible' => false));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Monthly Mean Temperatures (&deg;F)'))->legend(array('visible' => false))->addSeriesItem($series)->addCategoryAxisItem($categoryAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #14
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$polar = new \Kendo\Dataviz\UI\ChartSeriesItem();
$polar->type('polarArea')->data(array(array(10, 10), array(30, 20), array(50, 30), array(70, 20), array(90, 10), array(90, 0), array(230, 10), array(235, 20), array(240, 30), array(245, 20), array(250, 10)));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Polar area'))->legend(array('position' => 'bottom'))->addSeriesItem($polar);
echo $chart->render();
require_once '../include/footer.php';
예제 #15
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$battery = new \Kendo\Dataviz\UI\ChartSeriesItem();
$battery->type('column')->data(array(20, 40, 45, 30, 50))->stack(true)->name('on battery')->color('#cc6e38');
$gas = new \Kendo\Dataviz\UI\ChartSeriesItem();
$gas->type('column')->data(array(20, 30, 35, 35, 40))->stack(true)->name('on gas')->color('#ef955f');
$mpg = new \Kendo\Dataviz\UI\ChartSeriesItem();
$mpg->type('line')->data(array(30, 38, 40, 32, 42))->name('mpg')->color('#ec5e0a')->axis('mpg');
$l100km = new \Kendo\Dataviz\UI\ChartSeriesItem();
$l100km->type('line')->data(array(7.8, 6.2, 5.9, 7.4, 5.6))->name('l/100 km')->color('#4e4141')->axis('l100km');
$milesAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$milesAxis->title(array('text' => 'miles'))->min(0)->max(100);
$kmAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$kmAxis->name('km')->title(array('text' => 'km'))->min(0)->max(161)->majorUnit(32);
$mpgAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$mpgAxis->name('mpg')->title(array('text' => 'miles per gallo'))->color('#642381');
$l100kmAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$l100kmAxis->name('l100km')->title(array('text' => 'liters per 100km'))->color('#e5388a');
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->categories(array('Mon', 'Tue', 'Wed', 'Thu', 'Fri'))->axisCrossingValue(array(0, 0, 10, 10));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Hybrid car mileage report'))->legend(array('position' => 'top'))->addSeriesItem($battery, $gas, $mpg, $l100km)->addValueAxisItem($milesAxis, $kmAxis, $mpgAxis, $l100kmAxis)->addCategoryAxisItem($categoryAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #16
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$battery = new \Kendo\Dataviz\UI\ChartSeriesItem();
$battery->type('column')->data(array(20, 40, 45, 30, 50))->stack(true)->name('on battery')->color('#003c72');
$gas = new \Kendo\Dataviz\UI\ChartSeriesItem();
$gas->type('column')->data(array(20, 30, 35, 35, 40))->stack(true)->name('on gas')->color('#0399d4');
$mpg = new \Kendo\Dataviz\UI\ChartSeriesItem();
$mpg->type('area')->data(array(30, 38, 40, 32, 42))->name('mpg')->color('#642381')->axis('mpg');
$l100km = new \Kendo\Dataviz\UI\ChartSeriesItem();
$l100km->type('area')->data(array(7.8, 6.2, 5.9, 7.4, 5.6))->name('l/100 km')->color('#e5388a')->axis('l100km');
$milesAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$milesAxis->title(array('text' => 'miles'))->min(0)->max(100);
$kmAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$kmAxis->name('km')->title(array('text' => 'km'))->min(0)->max(161)->majorUnit(32);
$mpgAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$mpgAxis->name('mpg')->title(array('text' => 'miles per gallo'))->color('#642381');
$l100kmAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$l100kmAxis->name('l100km')->title(array('text' => 'liters per 100km'))->color('#e5388a');
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->categories(array('Mon', 'Tue', 'Wed', 'Thu', 'Fri'))->axisCrossingValue(array(0, 0, 10, 10));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Hybrid car mileage report'))->legend(array('position' => 'top'))->addSeriesItem($battery, $gas, $mpg, $l100km)->addValueAxisItem($milesAxis, $kmAxis, $mpgAxis, $l100kmAxis)->addCategoryAxisItem($categoryAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #17
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
require_once '../include/header.php';
$dataSource = new \Kendo\Data\DataSource();
$dataSource->data(chart_sun_position());
$position = new \Kendo\Dataviz\UI\ChartSeriesItem();
$position->type('polarLine')->xField('azimuth')->yField('altitude')->labels(array('template' => '#= dataItem.time.substring(0,2) #h', 'position' => 'below', 'visible' => true));
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->startAngle(-90)->majorUnit(30);
$yAxis = new \Kendo\Dataviz\UI\ChartYAxisItem();
$yAxis->labels(array('visible' => false));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Sun position at equinox'))->dataSource($dataSource)->addSeriesItem($position)->addXAxisItem($xAxis)->addYAxisItem($yAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #18
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$signal = new \Kendo\Dataviz\UI\ChartSeriesItem();
$signal->type('line')->data(array(20, 1, 18, 3, 15, 5, 10, 6, 9, 6, 10, 5, 13, 3, 16, 1, 19, 1, 20, 2, 18, 5, 12, 7, 10, 8))->markers(array('visible' => false))->style('smooth');
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->title(array('text' => 'time'))->majorGridLines(array('visible' => false))->majorTicks(array('visible' => false));
$valueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$valueAxis->max(22)->title(array('text' => 'voltage'))->majorGridLines(array('visible' => false))->visible(false);
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'A digital signal'))->legend(array('visible' => false))->addSeriesItem($signal)->addCategoryAxisItem($categoryAxis)->addValueAxisItem($valueAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #19
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_april_sales();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('verticalBullet')->currentField('current')->targetField('target')->gap(4)->target(array('color' => '#aaaaaa'));
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$tooltip->visible(true)->shared(true)->template('Target: #= value.target # items<br /> Actual: #= value.current # items');
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'remote-data-binding.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport);
$valueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$valueAxis->min(2000)->max(11000)->majorGridLines(array('visible' => false))->minorTicks(array('' => true))->addPlotBand(array('from' => 1000, 'to' => 3000, 'color' => '#aaaaaa', 'opacity' => 0.55), array('from' => 3000, 'to' => 5000, 'color' => '#aaaaaa', 'opacity' => 0.4), array('from' => 5000, 'to' => 8000, 'color' => '#aaaaaa', 'opacity' => 0.25), array('from' => 8000, 'to' => 11000, 'color' => '#aaaaaa', 'opacity' => 0.1));
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->majorGridLines(array('visible' => false))->field('category');
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->dataSource($dataSource)->legend(array('visible' => false))->addSeriesItem($series)->addCategoryAxisItem($categoryAxis)->addValueAxisItem($valueAxis)->tooltip($tooltip);
echo $chart->render();
?>
<style>
    .chart-wrapper {
        padding-top: 20px;
    }
예제 #20
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_japan_medals();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('bubble')->minSize(0)->maxSize(70)->xField('year')->yField('standing')->sizeField('number')->colorField('medalColor')->opacity(0.9);
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$tooltip->visible(true)->template('#= value.x #: #= value.size # Medals');
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'grouped-data.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport)->addGroupItem(array('field' => 'country'));
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->labels(array('skip' => 1, 'margin' => array('top' => -25)))->majorUnit(4)->min(1980)->max(2015)->majorGridLines(array('visible' => false))->line(array('visible' => false));
$yAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$yAxis->labels(array('step' => 1, 'skip' => 1, 'template' => '#= value # place', 'margin' => array('right' => -30), 'padding' => array('left' => 20)))->majorUnit(1)->min(0)->max(3.7)->majorGridLines(array('visible' => false))->line(array('visible' => false));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->dataSource($dataSource)->title(array('text', 'Olypmic Medals Won by Japan'))->legend(array('visible' => false))->addSeriesItem($series)->addXAxisItem($xAxis)->addYAxisItem($yAxis)->tooltip($tooltip);
echo $chart->render();
require_once '../include/footer.php';
예제 #21
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$maxTemperature = new \Kendo\Dataviz\UI\ChartSeriesItem();
$maxTemperature->type('line')->data(array(6, 10, 10, 10, 10, 9, 5, 5, 10, 8, 8, 5, 8, 11, 9, 15, 20, 23, 24, 21, 21, 20, 22, 22, 20, 18, 16, 15, 20, 13.2, 18))->name('Max. Temperature [&deg;C]')->color('#ff1c1c')->axis('temp');
$minTemperature = new \Kendo\Dataviz\UI\ChartSeriesItem();
$minTemperature->type('line')->data(array(-5, -6, 0, -4, -3, -5.2, -5, -1.7, -1, 0, -0.4, -2, -2, -5, 4, -2, -4, -1, -1, 2, 4, -1, 1, 1, 4, 0, -1, 1, -2, 5.7, 5))->name('Min. Temperature [&deg;C]')->color('#ffae00')->axis('temp');
$windSpeed = new \Kendo\Dataviz\UI\ChartSeriesItem();
$windSpeed->type('area')->data(array(16.4, 21.7, 35.4, 19, 10.9, 13.6, 10.9, 10.9, 10.9, 16.4, 16.4, 13.6, 13.6, 29.9, 27.1, 16.4, 13.6, 10.9, 16.4, 10.9, 24.5, 10.9, 8.1, 19, 21.7, 27.1, 24.5, 16.4, 27.1, 29.9, 27.1))->name('Wind Speed [km/h]')->color('#73c100')->axis('wind');
$rainfall = new \Kendo\Dataviz\UI\ChartSeriesItem();
$rainfall->type('area')->data(array(5.4, 2, 5.4, 3, 2, 1, 3.2, 7.4, 0, 8.199999999999999, 0, 1.8, 0.3, 0, 0, 2.3, 0, 3.7, 5.2, 6.5, 0, 7.1, 0, 4.7, 0, 1.8, 0, 0, 0, 1.5, 0.8))->name('Rainfall [mm]')->color('#007eff')->axis('rain');
$rainValueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$rainValueAxis->name('rain')->color('#007eff')->min(0)->max(60);
$windValueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$windValueAxis->name('wind')->color('#73c100')->min(0)->max(60);
$tempValueAxis = new \Kendo\Dataviz\UI\ChartValueAxisItem();
$tempValueAxis->name('temp')->min(-30)->max(30);
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->categories(array('1', '2', '3', '4', '5', '6', '7', '8', '9', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31'))->axisCrossingValue(array(32, 32, 0))->justified(true);
$tooltip = new \Kendo\Dataviz\UI\ChartTooltip();
$tooltip->visible(true)->format('{0}')->template('#= category #/03: #= value #');
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'March Weather Report'))->legend(array('position' => 'bottom'))->addSeriesItem($maxTemperature, $minTemperature, $windSpeed, $rainfall)->addValueAxisItem($rainValueAxis, $windValueAxis, $tempValueAxis)->addCategoryAxisItem($categoryAxis)->tooltip($tooltip)->seriesDefaults(array('type' => 'line'));
echo $chart->render();
require_once '../include/footer.php';
예제 #22
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('boxPlot')->lowerField('lower')->q1Field('q1')->medianField('median')->q3Field('q3')->upperField('upper')->meanField('mean')->outliersField('outliers');
$dataSource = new \Kendo\Data\DataSource();
$dataSource->data(ozone_oncentration());
$categoryAxis = new \Kendo\Dataviz\UI\ChartCategoryAxisItem();
$categoryAxis->field('year')->majorGridLines(array('visible' => false));
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Ozone Concentration (ppm)'))->legend(array('visible' => false))->dataSource($dataSource)->addSeriesItem($series)->addCategoryAxisItem($categoryAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #23
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/chart_data.php';
if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    header('Content-Type: application/json');
    $result = chart_antenna_gain();
    echo json_encode($result);
    exit;
}
require_once '../include/header.php';
$gain = new \Kendo\Dataviz\UI\ChartSeriesItem();
$gain->type('polarLine')->xField('azimuth')->yField('gain');
$xAxis = new \Kendo\Dataviz\UI\ChartXAxisItem();
$xAxis->majorUnit(30);
$transport = new \Kendo\Data\DataSourceTransport();
$transport->read(array('url' => 'remote-data-binding.php', 'type' => 'POST', 'dataType' => 'json'));
$dataSource = new \Kendo\Data\DataSource();
$dataSource->transport($transport);
$chart = new \Kendo\Dataviz\UI\Chart('chart');
$chart->title(array('text' => 'Antenna Gain (dB)'))->dataSource($dataSource)->addSeriesItem($gain)->addXAxisItem($xAxis);
echo $chart->render();
require_once '../include/footer.php';
예제 #24
0
<?php

require_once '../lib/Kendo/Autoload.php';
require_once '../include/header.php';
$series = new \Kendo\Dataviz\UI\ChartSeriesItem();
$series->type('funnel')->field('visitors')->dynamicHeight(false)->dynamicSlope(true)->labels(array('color' => 'black', 'visible' => true, 'background' => 'transparent', 'align' => 'left', 'template' => '#= dataItem.description #: #=value#'))->categoryField('description');
$dataSourceBefore = new \Kendo\Data\DataSource();
$dataSourceBefore->data(array(array('description' => 'All Visitors', 'visitors' => 23945), array('description' => 'Tried the Demos', 'visitors' => 19165), array('description' => 'Downloaded', 'visitors' => 13984), array('description' => 'Requested a Quote', 'visitors' => 3216), array('description' => 'Purchased', 'visitors' => 1673)));
$before = new \Kendo\Dataviz\UI\Chart('before');
$before->title(array('text' => 'Before optimization'))->dataSource($dataSourceBefore)->addSeriesItem($series)->legend(array('visible' => false))->tooltip(array('visible' => true, 'template' => '#= dataItem.description # #= kendo.format("{0:p}",data.value/dataItem.parent()[0].visitors)#'));
$dataSourceAfter = new \Kendo\Data\DataSource();
$dataSourceAfter->data(array(array('description' => 'All Visitors', 'visitors' => 28536), array('description' => 'Tried the Demos', 'visitors' => 26539), array('description' => 'Downloaded', 'visitors' => 23088), array('description' => 'Requested a Quote', 'visitors' => 13853), array('description' => 'Purchased', 'visitors' => 9697)));
$after = new \Kendo\Dataviz\UI\Chart('after');
$after->title(array('text' => 'After optimization'))->dataSource($dataSourceAfter)->addSeriesItem($series)->legend(array('visible' => false))->tooltip(array('visible' => true, 'template' => '#= dataItem.description # #= kendo.format("{0:p}",data.value/dataItem.parent()[0].visitors)#'));
?>

<div class="chart-wrapper">
    <h2>Website optimization stats</h2>
    <?php 
echo $before->render();
?>
    <?php 
echo $after->render();
?>
</div>

<style scoped>
    .chart-wrapper {
        height: 400px;
        width:730px;
        margin:20px auto;