{"id":37013776,"url":"https://github.com/bsadnu/yii2-googlecharts","last_synced_at":"2026-01-14T01:22:17.483Z","repository":{"id":62497703,"uuid":"63089501","full_name":"bsadnu/yii2-googlecharts","owner":"bsadnu","description":"Google Charts Extension for Yii 2","archived":false,"fork":false,"pushed_at":"2020-03-27T16:33:42.000Z","size":47,"stargazers_count":7,"open_issues_count":1,"forks_count":3,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-09-21T00:51:29.292Z","etag":null,"topics":["area-chart","bubble-chart","chart","charts","column-chart","google-charts","intervals-chart","scatter-plot"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"bsd-2-clause","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bsadnu.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-11T17:50:29.000Z","updated_at":"2021-11-28T10:46:38.000Z","dependencies_parsed_at":"2022-11-02T11:46:29.237Z","dependency_job_id":null,"html_url":"https://github.com/bsadnu/yii2-googlecharts","commit_stats":null,"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/bsadnu/yii2-googlecharts","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bsadnu%2Fyii2-googlecharts","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bsadnu%2Fyii2-googlecharts/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bsadnu%2Fyii2-googlecharts/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bsadnu%2Fyii2-googlecharts/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bsadnu","download_url":"https://codeload.github.com/bsadnu/yii2-googlecharts/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bsadnu%2Fyii2-googlecharts/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":28407684,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-01-14T00:40:43.272Z","status":"ssl_error","status_checked_at":"2026-01-14T00:40:42.636Z","response_time":56,"last_error":"SSL_connect returned=1 errno=0 peeraddr=140.82.121.5:443 state=error: unexpected eof while reading","robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":false,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["area-chart","bubble-chart","chart","charts","column-chart","google-charts","intervals-chart","scatter-plot"],"created_at":"2026-01-14T01:22:16.767Z","updated_at":"2026-01-14T01:22:17.463Z","avatar_url":"https://github.com/bsadnu.png","language":"PHP","funding_links":[],"categories":[],"sub_categories":[],"readme":"Google Charts Extension for Yii 2\n===============================\n\n[![Latest Stable Version](https://poser.pugx.org/bsadnu/yii2-googlecharts/v/stable)](https://packagist.org/packages/bsadnu/yii2-googlecharts) [![Total Downloads](https://poser.pugx.org/bsadnu/yii2-googlecharts/downloads)](https://packagist.org/packages/bsadnu/yii2-googlecharts) [![Latest Unstable Version](https://poser.pugx.org/bsadnu/yii2-googlecharts/v/unstable)](https://packagist.org/packages/bsadnu/yii2-googlecharts) [![License](https://poser.pugx.org/bsadnu/yii2-googlecharts/license)](https://packagist.org/packages/bsadnu/yii2-googlecharts)\n\nThis extension contains a set of chart widgets based on [Google Charts API](https://developers.google.com/chart/).\n\nInstallation\n------------\n\nThe preferred way to install this extension is through [composer](http://getcomposer.org/download/).\n\nEither run\n\n```\nphp composer.phar require --prefer-dist bsadnu/yii2-googlecharts \"*\"\n```\n\nor add\n\n```json\n\"bsadnu/yii2-googlecharts\": \"*\"\n```\n\nto the require section of your composer.json.\n\nUsage\n-----\n\nTo use any of these widgets,  simply add the following code in your view.\n\n### Column Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\ColumnChart;\n...\n```\n1) Simple Column Chart\n\n![demo](http://img.sbannikov.info/ColumnChartSimple.png)\n```php\n\u003c?= ColumnChart::widget([\n\t'id' =\u003e 'my-column-chart-id',\n    'data' =\u003e [\n        ['Year', 'Sales', 'Expenses'],\n        ['2013',  1000,      400],\n        ['2014',  1170,      460],\n        ['2015',  660,       1120],\n        ['2016',  1030,      540]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n        \t'left' =\u003e '5%',\n        \t'width' =\u003e '90%',\n        \t'height' =\u003e 350\n        ],\n        'tooltip' =\u003e [\n        \t'textStyle' =\u003e [\n        \t\t'fontName' =\u003e 'Verdana',\n        \t\t'fontSize' =\u003e 13\n        \t]\n        ],\n        'vAxis' =\u003e [\n        \t'title' =\u003e 'Sales and Expenses',\n        \t'titleTextStyle' =\u003e [\n        \t\t'fontSize' =\u003e 13,\n        \t\t'italic' =\u003e false\n        \t],\n        \t'gridlines' =\u003e [\n        \t\t'color' =\u003e '#e5e5e5',\n        \t\t'count' =\u003e 10\n        \t],            \t\n        \t'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n        \t'position' =\u003e 'top',\n        \t'alignment' =\u003e 'center',\n        \t'textStyle' =\u003e [\n        \t\t'fontSize' =\u003e 12\n        \t]\n        ]            \n    ]\n]) ?\u003e\n```\n\n2) Stacked Column Chart\n\n![demo](http://img.sbannikov.info/ColumnChartStacked.png)\n```php\n\u003c?= ColumnChart::widget([\n\t'id' =\u003e 'my-stacked-column-chart-id',\n    'data' =\u003e [\n\t\t['Genre', 'Fantasy \u0026 Sci Fi', 'Romance', 'Mystery/Crime', 'General', 'Western', 'Literature'],\n\t\t['2000', 20, 30, 35, 40, 45, 30],\n\t\t['2005', 14, 20, 25, 30, 48, 30],\n\t\t['2010', 10, 24, 20, 32, 18, 5],\n\t\t['2015', 15, 25, 30, 35, 20, 15],\n\t\t['2020', 16, 22, 23, 30, 16, 9],\n\t\t['2025', 12, 26, 20, 40, 20, 30],\n\t\t['2030', 28, 19, 29, 30, 12, 13]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n        \t'left' =\u003e '5%',\n        \t'width' =\u003e '90%',\n        \t'height' =\u003e 350\n        ],\n        'isStacked' =\u003e true,\n        'tooltip' =\u003e [\n        \t'textStyle' =\u003e [\n        \t\t'fontName' =\u003e 'Verdana',\n        \t\t'fontSize' =\u003e 13\n        \t]\n        ],\n        'vAxis' =\u003e [\n        \t'title' =\u003e 'Sales and Expenses',\n        \t'titleTextStyle' =\u003e [\n        \t\t'fontSize' =\u003e 13,\n        \t\t'italic' =\u003e false\n        \t],\n        \t'gridlines' =\u003e [\n        \t\t'color' =\u003e '#e5e5e5',\n        \t\t'count' =\u003e 10\n        \t],            \t\n        \t'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n        \t'position' =\u003e 'top',\n        \t'alignment' =\u003e 'center',\n        \t'textStyle' =\u003e [\n        \t\t'fontSize' =\u003e 12\n        \t]\n        ]            \n    ]\n]) ?\u003e\n```\n\n3) Trendlines Column Chart\n\n![demo](http://img.sbannikov.info/ColumnChartTrendlines.png)\n```php\n\u003c?= ColumnChart::widget([\n    'id' =\u003e 'my-column-trendlines-chart-id',\n    'data' =\u003e [\n        ['Week', 'Bugs', 'Tests'],\n        [1, 175, 10],\n        [2, 159, 20],\n        [3, 126, 35],\n        [4, 129, 40],\n        [5, 108, 60],\n        [6, 92, 70],\n        [7, 55, 72],\n        [8, 50, 97]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 450,\n        'curveType' =\u003e 'function',\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '92%',\n            'height' =\u003e 350\n        ],\n        'hAxis' =\u003e [\n            'format' =\u003e '#',\n            'viewWindow' =\u003e [\n                'min' =\u003e 0,\n                'max' =\u003e 9\n            ],            \n            'gridlines' =\u003e [\n                'count' =\u003e 10\n            ]\n        ],   \n        'vAxis' =\u003e [\n            'title' =\u003e 'Bugs and tests',\n            'titleTextStyle' =\u003e [\n                'fontSize' =\u003e 13,\n                'italic' =\u003e false\n            ],            \n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 10\n            ],\n            'minValue' =\u003e 0\n        ],\n        'colors' =\u003e [\n            '#6D4C41',\n            '#FB8C00'\n        ],\n        'trendlines' =\u003e [\n            0 =\u003e [\n                'labelInLegend' =\u003e 'Bug line',\n                'visibleInLegend' =\u003e true\n            ],            \n            1 =\u003e [\n                'labelInLegend' =\u003e 'Test line',\n                'visibleInLegend' =\u003e true\n            ]\n        ],             \n        'legend' =\u003e [\n            'position' =\u003e 'top',\n            'alignment' =\u003e 'end',\n            'textStyle' =\u003e [\n                'fontSize' =\u003e 12\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n4) Diff Column Chart\n\n![demo](http://img.sbannikov.info/ColumnChartDiff.png)\n```php\n\u003c?= ColumnChart::widget([\n    'id' =\u003e 'my-column-diff-chart-id',\n    'data' =\u003e [\n        ['Name', 'Popularity'],\n        ['Cesar', 425],\n        ['Rachel', 420],\n        ['Patrick', 290],\n        ['Eric', 620],\n        ['Eugene', 520],\n        ['John', 460],\n        ['Greg', 420],\n        ['Matt', 410]\n    ],\n    'extraData' =\u003e [\n        ['Name', 'Popularity'],\n        ['Cesar', 307],\n        ['Rachel', 360],\n        ['Patrick', 200],\n        ['Eric', 550],\n        ['Eugene', 460],\n        ['John', 320],\n        ['Greg', 390],\n        ['Matt', 360]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e '5%',\n            'width' =\u003e '90%',\n            'height' =\u003e 350\n        ],\n        'colors' =\u003e [\n            '#4CAF50'\n        ],\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ],              \n        'hAxis' =\u003e [\n            'format' =\u003e '#',\n            'viewWindow' =\u003e [\n                'min' =\u003e 0,\n                'max' =\u003e 9\n            ],            \n            'gridlines' =\u003e [\n                'count' =\u003e 10\n            ]\n        ],   \n        'vAxis' =\u003e [\n            'title' =\u003e 'Popularity',\n            'titleTextStyle' =\u003e [\n                'fontSize' =\u003e 13,\n                'italic' =\u003e false\n            ],            \n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 10\n            ],\n            'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n            'position' =\u003e 'top',\n            'alignment' =\u003e 'end',\n            'textStyle' =\u003e [\n                'fontSize' =\u003e 12\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n### Bar Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\BarChart;\n...\n```\n1) Simple Bar Chart\n\n![demo](http://img.sbannikov.info/BarChart.png)\n```php\n\u003c?= BarChart::widget([\n\t'id' =\u003e 'my-bar-chart-id',\n    'data' =\u003e [\n        ['Year', 'Sales', 'Expenses'],\n        ['2004',  1000,      400],\n        ['2005',  1170,      460],\n        ['2006',  660,       1120],\n        ['2007',  1030,      540]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n        \t'left' =\u003e '5%',\n        \t'width' =\u003e '90%',\n        \t'height' =\u003e 350\n        ],\n        'tooltip' =\u003e [\n        \t'textStyle' =\u003e [\n        \t\t'fontName' =\u003e 'Verdana',\n        \t\t'fontSize' =\u003e 13\n        \t]\n        ],\n        'vAxis' =\u003e [\n        \t'gridlines' =\u003e [\n        \t\t'color' =\u003e '#e5e5e5',\n        \t\t'count' =\u003e 10\n        \t],            \t\n        \t'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n        \t'position' =\u003e 'top',\n        \t'alignment' =\u003e 'center',\n        \t'textStyle' =\u003e [\n        \t\t'fontSize' =\u003e 12\n        \t]\n        ]            \n    ]\n]) ?\u003e\n```\n\n2) Stacked Bar Chart\n\n![demo](http://img.sbannikov.info/BarChartStacked.png)\n```php\n\u003c?= BarChart::widget([\n\t'id' =\u003e 'my-stacked-bar-chart-id',\n    'data' =\u003e [\n\t\t['Genre', 'Fantasy \u0026 Sci Fi', 'Romance', 'Mystery/Crime', 'General', 'Western', 'Literature'],\n\t\t['2000', 20, 30, 35, 40, 45, 30],\n\t\t['2005', 14, 20, 25, 30, 48, 30],\n\t\t['2010', 10, 24, 20, 32, 18, 5],\n\t\t['2015', 15, 25, 30, 35, 20, 15],\n\t\t['2020', 16, 22, 23, 30, 16, 9],\n\t\t['2025', 12, 26, 20, 40, 20, 30],\n\t\t['2030', 28, 19, 29, 30, 12, 13]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n        \t'left' =\u003e '5%',\n        \t'width' =\u003e '90%',\n        \t'height' =\u003e 350\n        ],\n        'isStacked' =\u003e true,\n        'tooltip' =\u003e [\n        \t'textStyle' =\u003e [\n        \t\t'fontName' =\u003e 'Verdana',\n        \t\t'fontSize' =\u003e 13\n        \t]\n        ],\n        'hAxis' =\u003e [\n        \t'gridlines' =\u003e [\n        \t\t'color' =\u003e '#e5e5e5',\n        \t\t'count' =\u003e 10\n        \t],            \t\n        \t'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n        \t'position' =\u003e 'top',\n        \t'alignment' =\u003e 'center',\n        \t'textStyle' =\u003e [\n        \t\t'fontSize' =\u003e 12\n        \t]\n        ]            \n    ]\n]) ?\u003e\n```\n\n### Histogram Example\n```php\n...\nuse bsadnu\\googlecharts\\Histogram;\n...\n```\n![demo](http://img.sbannikov.info/Histogram.png)\n```php\n\u003c?= Histogram::widget([\n\t'id' =\u003e 'my-simple-histogram-id',\n\t'data' =\u003e [\n\t\t['Dinosaur', 'Length'],\n\t\t['Acrocanthosaurus (top-spined lizard)', 12.2],\n\t\t['Albertosaurus (Alberta lizard)', 9.1],\n\t\t['Allosaurus (other lizard)', 12.2],\n\t\t['Apatosaurus (deceptive lizard)', 22.9],\n\t\t['Archaeopteryx (ancient wing)', 0.9],\n\t\t['Argentinosaurus (Argentina lizard)', 36.6],\n\t\t['Baryonyx (heavy claws)', 9.1],\n\t\t['Brachiosaurus (arm lizard)', 30.5],\n\t\t['Ceratosaurus (horned lizard)', 6.1],\n\t\t['Coelophysis (hollow form)', 2.7],\n\t\t['Compsognathus (elegant jaw)', 0.9],\n\t\t['Deinonychus (terrible claw)', 2.7],\n\t\t['Diplodocus (double beam)', 27.1],\n\t\t['Dromicelomimus (emu mimic)', 3.4],\n\t\t['Gallimimus (fowl mimic)', 5.5],\n\t\t['Mamenchisaurus (Mamenchi lizard)', 21.0],\n\t\t['Megalosaurus (big lizard)', 7.9],\n\t\t['Microvenator (small hunter)', 1.2],\n\t\t['Ornithomimus (bird mimic)', 4.6],\n\t\t['Oviraptor (egg robber)', 1.5],\n\t\t['Plateosaurus (flat lizard)', 7.9],\n\t\t['Sauronithoides (narrow-clawed lizard)', 2.0],\n\t\t['Seismosaurus (tremor lizard)', 45.7],\n\t\t['Spinosaurus (spiny lizard)', 12.2],\n\t\t['Supersaurus (super lizard)', 30.5],\n\t\t['Tyrannosaurus (tyrant lizard)', 15.2],\n\t\t['Ultrasaurus (ultra lizard)', 30.5],\n\t\t['Velociraptor (swift robber)', 1.8]\n\t],\n\t'options' =\u003e [\n\t    'fontName' =\u003e 'Verdana',\n\t    'height' =\u003e 400,\n\t    'fontSize' =\u003e 12,\n\t    'chartArea' =\u003e [\n\t    \t'left' =\u003e '5%',\n\t    \t'width' =\u003e '90%',\n\t    \t'height' =\u003e 350\n\t    ],\n\t    'isStacked' =\u003e true,\n\t    'tooltip' =\u003e [\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontName' =\u003e 'Verdana',\n\t    \t\t'fontSize' =\u003e 13\n\t    \t]\n\t    ],\n\t    'vAxis' =\u003e [\n\t    \t'title' =\u003e 'Dinosaur length',\n\t    \t'titleTextStyle' =\u003e [\n\t    \t\t'fontSize' =\u003e 13,\n\t    \t\t'italic' =\u003e false\n\t    \t],        \t\n\t    \t'gridlines' =\u003e [\n\t    \t\t'color' =\u003e '#e5e5e5',\n\t    \t\t'count' =\u003e 10\n\t    \t],            \t\n\t    \t'minValue' =\u003e 0\n\t    ],        \n\t    'hAxis' =\u003e [\n\t    \t'gridlines' =\u003e [\n\t    \t\t'color' =\u003e '#e5e5e5'\n\t    \t],            \t\n\t    \t'minValue' =\u003e 0\n\t    ],\n\t    'legend' =\u003e [\n\t    \t'position' =\u003e 'top',\n\t    \t'alignment' =\u003e 'center',\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontSize' =\u003e 12\n\t    \t]\n\t    ]            \n\t]\n]) ?\u003e\n```\n\n### Combo Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\ComboChart;\n...\n```\n![demo](http://img.sbannikov.info/ComboChart.png)\n```php\n\u003c?= ComboChart::widget([\n\t'id' =\u003e 'my-combo-chart-id',\n\t'data' =\u003e [\n\t\t['Month', 'Bolivia', 'Ecuador', 'Madagascar', 'Papua New Guinea', 'Rwanda', 'Average'],\n\t\t['2004/05',  165,      938,         522,             998,           450,      614.6],\n\t\t['2005/06',  135,      1120,        599,             1268,          288,      682],\n\t\t['2006/07',  157,      1167,        587,             807,           397,      623],\n\t\t['2007/08',  139,      1110,        615,             968,           215,      609.4],\n\t\t['2008/09',  136,      691,         629,             1026,          366,      569.6]\n\t],\n\t'options' =\u003e [\n\t    'fontName' =\u003e 'Verdana',\n\t    'height' =\u003e 400,\n\t    'fontSize' =\u003e 12,\n\t    'chartArea' =\u003e [\n\t    \t'left' =\u003e '5%',\n\t    \t'width' =\u003e '90%',\n\t    \t'height' =\u003e 350\n\t    ],\n\t    'seriesType' =\u003e 'bars',\n\t\t'series' =\u003e [\n\t\t\t5 =\u003e [\n\t\t\t\t'type' =\u003e 'line',\n\t\t\t\t'pointSize' =\u003e 5\n\t\t\t]\n\t\t],        \n\t    'tooltip' =\u003e [\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontName' =\u003e 'Verdana',\n\t    \t\t'fontSize' =\u003e 13\n\t    \t]\n\t    ],\n\t    'vAxis' =\u003e [\n\t    \t'gridlines' =\u003e [\n\t    \t\t'color' =\u003e '#e5e5e5',\n\t    \t\t'count' =\u003e 10\n\t    \t],            \t\n\t    \t'minValue' =\u003e 0\n\t    ],        \n\t    'legend' =\u003e [\n\t    \t'position' =\u003e 'top',\n\t    \t'alignment' =\u003e 'center',\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontSize' =\u003e 12\n\t    \t]\n\t    ]            \n\t]\n]) ?\u003e\n```\n\n### Line Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\LineChart;\n...\n```\n1) Simple Line Chart\n\n![demo](http://img.sbannikov.info/LineChartSimple.png)\n```php\n\u003c?= LineChart::widget([\n\t'id' =\u003e 'my-simple-line-chart-id',\n\t'data' =\u003e [\n\t\t['Year', 'Sales', 'Expenses'],\n\t\t['2004',  1000,      400],\n\t\t['2005',  1170,      460],\n\t\t['2006',  660,       1120],\n\t\t['2007',  1030,      540]\n\t],\n\t'options' =\u003e [\n\t    'fontName' =\u003e 'Verdana',\n\t    'height' =\u003e 400,\n\t    'curveType' =\u003e 'function',\n\t    'fontSize' =\u003e 12,\n\t    'chartArea' =\u003e [\n\t    \t'left' =\u003e '5%',\n\t    \t'width' =\u003e '90%',\n\t    \t'height' =\u003e 350\n\t    ],\n\t    'pointSize' =\u003e 4,\n\t    'tooltip' =\u003e [\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontName' =\u003e 'Verdana',\n\t    \t\t'fontSize' =\u003e 13\n\t    \t]\n\t    ],\n\t    'vAxis' =\u003e [\n\t    \t'title' =\u003e 'Sales and Expenses',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n\t    \t'gridlines' =\u003e [\n\t    \t\t'color' =\u003e '#e5e5e5',\n\t    \t\t'count' =\u003e 10\n\t    \t],            \t\n\t    \t'minValue' =\u003e 0\n\t    ],        \n\t    'legend' =\u003e [\n\t    \t'position' =\u003e 'top',\n\t    \t'alignment' =\u003e 'center',\n\t    \t'textStyle' =\u003e [\n\t    \t\t'fontSize' =\u003e 12\n\t    \t]\n\t    ]            \n\t]\n]) ?\u003e\n```\n\n2) Line Intervals Chart\n\n![demo](http://img.sbannikov.info/LineChartIntervals.png)\n```php\n\u003c?= LineChart::widget([\n\t'id' =\u003e 'my-line-intervals-id',\n\t'isIntervalType' =\u003e true,\n\t'data' =\u003e [\n\t\t['a', 100, 90, 110, 85, 96, 104, 120],\n\t\t['b', 120, 95, 130, 90, 113, 124, 140],\n\t\t['c', 130, 105, 140, 100, 117, 133, 139],\n\t\t['d', 90, 85, 95, 85, 88, 92, 95],\n\t\t['e', 70, 74, 63, 67, 69, 70, 72],\n\t\t['f', 30, 39, 22, 21, 28, 34, 40],\n\t\t['g', 80, 77, 83, 70, 77, 85, 90],\n\t\t['h', 100, 90, 110, 85, 95, 102, 110]\n\t],\n\t'options' =\u003e [\n\t\t'fontName' =\u003e 'Verdana',\n\t\t'height' =\u003e 400,\n\t\t'curveType' =\u003e 'function',\n\t\t'fontSize' =\u003e 12,\n\t\t'chartArea' =\u003e [\n\t\t\t'left' =\u003e '5%',\n\t\t\t'width' =\u003e '90%',\n\t\t\t'height' =\u003e 350\n\t\t],\n\t\t'lineWidth' =\u003e 3,\n\t\t'tooltip' =\u003e [\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontName' =\u003e 'Verdana',\n\t\t\t\t'fontSize' =\u003e 13\n\t\t\t]\n\t\t],\n\t\t'series' =\u003e [\n\t\t\t[\n\t\t\t\t'color' =\u003e '#EF5350'\n\t\t\t]\n\t\t],\n\t\t'intervals' =\u003e [\n\t\t\t'style' =\u003e 'line'\n\t\t],\n\t\t'pointSize' =\u003e 5,\t\n\t\t'vAxis' =\u003e [\n\t\t\t'title' =\u003e 'Number values',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n\t\t\t'gridlines' =\u003e [\n\t\t\t\t'color' =\u003e '#e5e5e5',\n\t\t\t\t'count' =\u003e 10\n\t\t\t],            \t\n\t\t\t'minValue' =\u003e 0\n\t\t],        \n\t\t'legend' =\u003e 'none'            \n\t]\n]) ?\u003e\n```\n\n3) Line Intervals Area Chart\n\n![demo](http://img.sbannikov.info/LineChartIntervalsArea.png)\n```php\n\u003c?= LineChart::widget([\n\t'id' =\u003e 'my-area-intervals-id',\n\t'isIntervalType' =\u003e true,\n\t'data' =\u003e [\n\t\t['a', 100, 90, 110, 85, 96, 104, 120],\n\t\t['b', 120, 95, 130, 90, 113, 124, 140],\n\t\t['c', 130, 105, 140, 100, 117, 133, 139],\n\t\t['d', 90, 85, 95, 85, 88, 92, 95],\n\t\t['e', 70, 74, 63, 67, 69, 70, 72],\n\t\t['f', 30, 39, 22, 21, 28, 34, 40],\n\t\t['g', 80, 77, 83, 70, 77, 85, 90],\n\t\t['h', 100, 90, 110, 85, 95, 102, 110]\n\t],\n\t'options' =\u003e [\n\t\t'fontName' =\u003e 'Verdana',\n\t\t'height' =\u003e 400,\n\t\t'curveType' =\u003e 'function',\n\t\t'fontSize' =\u003e 12,\n\t\t'chartArea' =\u003e [\n\t\t\t'left' =\u003e '5%',\n\t\t\t'width' =\u003e '90%',\n\t\t\t'height' =\u003e 350\n\t\t],\n\t\t'lineWidth' =\u003e 2,\n\t\t'tooltip' =\u003e [\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontName' =\u003e 'Verdana',\n\t\t\t\t'fontSize' =\u003e 13\n\t\t\t]\n\t\t],\n\t\t'series' =\u003e [\n\t\t\t[\n\t\t\t\t'color' =\u003e '#43A047'\n\t\t\t]\n\t\t],\n\t\t'intervals' =\u003e [\n\t\t\t'style' =\u003e 'area'\n\t\t],\n\t\t'pointSize' =\u003e 5,\t\n\t\t'vAxis' =\u003e [\n\t\t\t'title' =\u003e 'Number values',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n\t\t\t'gridlines' =\u003e [\n\t\t\t\t'color' =\u003e '#e5e5e5',\n\t\t\t\t'count' =\u003e 10\n\t\t\t],            \t\n\t\t\t'minValue' =\u003e 0\n\t\t],        \n\t\t'legend' =\u003e 'none'            \n\t]\n]) ?\u003e\n```\n\n### Area Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\AreaChart;\n...\n```\n1) Simple Area Chart\n\n![demo](http://img.sbannikov.info/AreaChart.png)\n```php\n\u003c?= AreaChart::widget([\n\t'id' =\u003e 'my-simple-area-chart-id',\n    'data' =\u003e [\n\t\t['Year', 'Sales', 'Expenses'],\n\t\t['2004',  1000,      400],\n\t\t['2005',  1170,      460],\n\t\t['2006',  660,       1120],\n\t\t['2007',  1030,      540]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 400,\n        'curveType' =\u003e 'function',\n        'fontSize' =\u003e 12,\n        'areaOpacity' =\u003e 0.4,\n        'chartArea' =\u003e [\n        \t'left' =\u003e '5%',\n        \t'width' =\u003e '90%',\n        \t'height' =\u003e 350\n        ],\n        'pointSize' =\u003e 4,\n        'tooltip' =\u003e [\n        \t'textStyle' =\u003e [\n        \t\t'fontName' =\u003e 'Verdana',\n        \t\t'fontSize' =\u003e 13\n        \t]\n        ],\n        'vAxis' =\u003e [\n        \t'title' =\u003e 'Sales and Expenses',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n        \t'gridarea' =\u003e [\n        \t\t'color' =\u003e '#e5e5e5',\n        \t\t'count' =\u003e 10\n        \t],            \t\n        \t'minValue' =\u003e 0\n        ],        \n        'legend' =\u003e [\n        \t'position' =\u003e 'top',\n        \t'alignment' =\u003e 'end',\n        \t'textStyle' =\u003e [\n        \t\t'fontSize' =\u003e 12\n        \t]\n        ]            \n    ]\n]) ?\u003e\n```\n\n2) Stacked Area Chart\n\n![demo](http://img.sbannikov.info/AreaChartStacked.png)\n```php\n\u003c?= AreaChart::widget([\n\t'id' =\u003e 'my-staked-area-chart-id',\n\t'data' =\u003e [\n\t\t['Year', 'Cars', 'Trucks', 'Drones', 'Segways'],\n\t\t['2013',  870,  460, 310, 220],\n\t\t['2014',  460,  720, 220, 460],\n\t\t['2015',  930,  640, 340, 330],\n\t\t['2016',  1000,  400, 180, 500]\n\t],\n\t'options' =\u003e [\n\t\t'fontName' =\u003e 'Verdana',\n\t\t'height' =\u003e 400,\n\t\t'curveType' =\u003e 'function',\n\t\t'fontSize' =\u003e 12,\n\t\t'areaOpacity' =\u003e 0.4,\n\t\t'chartArea' =\u003e [\n\t\t\t'left' =\u003e '5%',\n\t\t\t'width' =\u003e '90%',\n\t\t\t'height' =\u003e 350\n\t\t],\n\t\t'isStacked' =\u003e true,\n\t\t'pointSize' =\u003e 4,\n\t\t'tooltip' =\u003e [\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontName' =\u003e 'Verdana',\n\t\t\t\t'fontSize' =\u003e 13\n\t\t\t]\n\t\t],\n\t\t'lineWidth' =\u003e 1.5,\n\t\t'vAxis' =\u003e [\n\t\t\t'title' =\u003e 'Number values',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n\t\t\t'gridlines' =\u003e [\n\t\t\t\t'color' =\u003e '#e5e5e5',\n\t\t\t\t'count' =\u003e 10\n\t\t\t],            \t\n\t\t\t'minValue' =\u003e 0\n\t\t],        \n\t\t'legend' =\u003e [\n\t\t\t'position' =\u003e 'top',\n\t\t\t'alignment' =\u003e 'end',\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 12\n\t\t\t]\n\t\t]            \n\t]\n]) ?\u003e\n```\n\n### Stepped Area Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\SteppedAreaChart;\n...\n```\n![demo](http://img.sbannikov.info/SteppedAreaChart.png)\n```php\n\u003c?= SteppedAreaChart::widget([\n\t'id' =\u003e 'my-stepped-area-chart-id',\n\t'data' =\u003e [\n\t\t['Director (Year)',  'Rotten Tomatoes', 'IMDB'],\n\t\t['Alfred Hitchcock (1935)', 8.4,         7.9],\n\t\t['Ralph Thomas (1959)',     6.9,         6.5],\n\t\t['Don Sharp (1978)',        6.5,         6.4],\n\t\t['James Hawes (2008)',      4.4,         6.2]\n\t],\n\t'options' =\u003e [\n\t\t'fontName' =\u003e 'Verdana',\n\t\t'height' =\u003e 400,\n\t\t'isStacked' =\u003e true,\n\t\t'fontSize' =\u003e 12,\n\t\t'chartArea' =\u003e [\n\t\t\t'left' =\u003e '5%',\n\t\t\t'width' =\u003e '90%',\n\t\t\t'height' =\u003e 350\n\t\t],\n\t\t'lineWidth' =\u003e 1,\n\t\t'tooltip' =\u003e [\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontName' =\u003e 'Verdana',\n\t\t\t\t'fontSize' =\u003e 13\n\t\t\t]\n\t\t],\n\t\t'pointSize' =\u003e 5,\t\n\t\t'vAxis' =\u003e [\n\t\t\t'title' =\u003e 'Accumulated Rating',\n\t\t\t'titleTextStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 13,\n\t\t\t\t'italic' =\u003e false\n\t\t\t],        \t\n\t\t\t'gridlines' =\u003e [\n\t\t\t\t'color' =\u003e '#e5e5e5',\n\t\t\t\t'count' =\u003e 10\n\t\t\t],            \t\n\t\t\t'minValue' =\u003e 0\n\t\t],        \n\t\t'legend' =\u003e [\n\t\t\t'position' =\u003e 'top',\n\t\t\t'alignment' =\u003e 'center',\n\t\t\t'textStyle' =\u003e [\n\t\t\t\t'fontSize' =\u003e 12\n\t\t\t]\n\t\t]            \n\t]\n]) ?\u003e\n```\n\n### Pie Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\PieChart;\n...\n```\n![demo](http://img.sbannikov.info/PieChart.png)\n```php\n\u003c?= PieChart::widget([\n    'id' =\u003e 'my-pie-chart-id',\n    'data' =\u003e [\n        ['Major', 'Degrees'],\n        ['Business', 256070],\n        ['Education', 108034],\n        ['Social Sciences \u0026 History', 127101],\n        ['Health', 81863],\n        ['Psychology', 74194]\n    ],\n    'extraData' =\u003e [\n        ['Major', 'Degrees'],\n        ['Business', 358293],\n        ['Education', 101265],\n        ['Social Sciences \u0026 History', 172780],\n        ['Health', 129634],\n        ['Psychology', 97216]\n    ],                \n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 300,\n        'width' =\u003e 500,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '90%',\n            'height' =\u003e '90%'\n        ],\n        'diff' =\u003e [\n            'extraData' =\u003e [\n                'inCenter' =\u003e false\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n### Sankey Diagram Example\n```php\n...\nuse bsadnu\\googlecharts\\Sankey;\n...\n```\n![demo](http://img.sbannikov.info/Sankey.png)\n```php\n\u003c?= Sankey::widget([\n    'id' =\u003e 'my-sankey-diagram-id',\n    'data' =\u003e [\n        [ 'Brazil', 'Portugal', 4 ],\n        [ 'Brazil', 'France', 1 ],\n        [ 'Brazil', 'Spain', 1 ],\n        [ 'Brazil', 'England', 1 ],\n        [ 'Canada', 'Portugal', 1 ],\n        [ 'Canada', 'France', 4 ],\n        [ 'Canada', 'England', 1 ],\n        [ 'Mexico', 'Portugal', 1 ],\n        [ 'Mexico', 'France', 1 ],\n        [ 'Mexico', 'Spain', 4 ],\n        [ 'Mexico', 'England', 1 ],\n        [ 'USA', 'Portugal', 1 ],\n        [ 'USA', 'France', 1 ],\n        [ 'USA', 'Spain', 1 ],\n        [ 'USA', 'England', 4 ],\n        [ 'Portugal', 'Angola', 2 ],\n        [ 'Portugal', 'Senegal', 1 ],\n        [ 'Portugal', 'Morocco', 1 ],\n        [ 'Portugal', 'South Africa', 3 ],\n        [ 'France', 'Angola', 1 ],\n        [ 'France', 'Mali', 3 ],\n        [ 'France', 'Morocco', 3 ],\n        [ 'France', 'South Africa', 1 ],\n        [ 'Spain', 'Senegal', 1 ],\n        [ 'Spain', 'Morocco', 3 ],\n        [ 'Spain', 'South Africa', 1 ],\n        [ 'England', 'Angola', 1 ],\n        [ 'England', 'Senegal', 1 ],\n        [ 'England', 'Morocco', 2 ],\n        [ 'England', 'South Africa', 4 ],\n        [ 'South Africa', 'India', 1 ],\n        [ 'South Africa', 'Japan', 3 ],\n        [ 'Angola', 'China', 2 ],\n        [ 'Angola', 'India', 1 ],\n        [ 'Angola', 'Japan', 3 ],\n        [ 'Senegal', 'China', 2 ],\n        [ 'Senegal', 'India', 1 ],\n        [ 'Senegal', 'Japan', 3 ],\n        [ 'Mali', 'China', 2 ],\n        [ 'Mali', 'India', 1 ],\n        [ 'Mali', 'Japan', 3 ],\n        [ 'Morocco', 'China', 2 ],\n        [ 'Morocco', 'India', 1 ],\n        [ 'Morocco', 'Japan', 3 ],\n        [ 'Morocco', 'Senegal', 1 ]\n    ],\n    'options' =\u003e [\n        'height' =\u003e 400,\n        'sankey' =\u003e [\n            'link' =\u003e [\n                'color' =\u003e [\n                    'fill' =\u003e '#eee',\n                    'fillOpacity' =\u003e 0.3\n                ]\n            ],\n            'node' =\u003e [\n                'width' =\u003e 8,\n                'nodePadding' =\u003e 80,\n                'label' =\u003e [\n                    'fontName' =\u003e 'Verdana',\n                    'fontSize' =\u003e 13\n                ]\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n### Geo Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\GeoChart;\n...\n```\n![demo](http://img.sbannikov.info/GeoChartRegions.png)\n```php\n\u003c?= GeoChart::widget([\n    'id' =\u003e 'my-regions-geo-chart-id',\n    'data' =\u003e [\n        ['Country', 'Popularity'],\n        ['Germany', 200],\n        ['United States', 300],\n        ['Brazil', 400],\n        ['Canada', 500],\n        ['France', 600],\n        ['RU', 700]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 500,\n        'width' =\u003e '100%',\n        'fontSize' =\u003e 12,\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ]              \n    ]\n]) ?\u003e\n```\n\n### Bubble Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\BubbleChart;\n...\n```\n1) Simple Bubble Chart\n\n![demo](http://img.sbannikov.info/BubbleChartSimple.png)\n```php\n\u003c?= BubbleChart::widget([\n    'id' =\u003e 'my-simple-bubble-chart-id',\n    'data' =\u003e [\n        ['ID', 'Life Expectancy', 'Fertility Rate', 'Region'],\n        ['CAN',    82.66,              1.67,      'North America'],\n        ['DEU',    79.84,              1.36,      'Europe'],\n        ['DNK',    70.6,               1.84,      'Europe'],\n        ['EGY',    72.73,              2.78,      'Middle East'],\n        ['GBR',    75.05,              2,         'Europe'],\n        ['IRN',    72.49,              0.7,       'Middle East'],\n        ['IRQ',    68.09,              4.77,      'Middle East'],\n        ['ISR',    81.55,              3.96,      'Middle East'],\n        ['RUS',    68.6,               1.54,      'Europe'],\n        ['USA',    78.09,              3.05,      'North America']\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 450,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '90%',\n            'height' =\u003e 400\n        ],\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ],\n        'vAxis' =\u003e [\n            'title' =\u003e 'Fertility Rate',\n            'titleTextStyle' =\u003e [\n                'fontSize' =\u003e 13,\n                'italic' =\u003e false\n            ],\n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 10\n            ],\n            'minValue' =\u003e 0\n        ],\n        'bubble' =\u003e [\n            'textStyle' =\u003e [\n                'auraColor' =\u003e 'none',\n                'color' =\u003e '#fff'\n            ],\n            'stroke' =\u003e '#fff'\n        ],\n        'legend' =\u003e [\n            'position' =\u003e 'top',\n            'alignment' =\u003e 'center',\n            'textStyle' =\u003e [\n                'fontSize' =\u003e 12\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n2) Bubble Chart Color by Numbers\n\n![demo](http://img.sbannikov.info/BubbleChartColorByNumbers.png)\n```php\n\u003c?= BubbleChart::widget([\n    'id' =\u003e 'my-colnumb-bubble-chart-id',\n    'data' =\u003e [\n        ['ID', 'X', 'Y', 'Temperature'],\n        ['',   80,  167,      120],\n        ['',   79,  136,      130],\n        ['',   78,  184,      50],\n        ['',   72,  278,      230],\n        ['',   81,  200,      210],\n        ['',   72,  170,      100],\n        ['',   68,  477,      80]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 450,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '90%',\n            'height' =\u003e 400\n        ],\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ],\n        'vAxis' =\u003e [\n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 10\n            ],\n            'minValue' =\u003e 0\n        ],\n        'bubble' =\u003e [\n            'textStyle' =\u003e [\n                'fontSize' =\u003e 11\n            ],\n            'stroke' =\u003e '#fff'\n        ]\n    ]\n]) ?\u003e\n```\n\n### Scatter Chart Example\n```php\n...\nuse bsadnu\\googlecharts\\ScatterChart;\n...\n```\n1) Simple Scatter Chart\n\n![demo](http://img.sbannikov.info/ScatterChartSimple.png)\n```php\n\u003c?= ScatterChart::widget([\n    'id' =\u003e 'my-scatter-simple-chart-id',\n    'data' =\u003e [\n        ['Age', 'Weight'],\n        [ 8,      12],\n        [ 4,      6],\n        [ 11,     14],\n        [ 4,      5],\n        [ 3,      3.5],\n        [ 6.5,    7],\n        [ 7,    10],\n        [ 6.5,    12],\n        [ 6,    13],\n        [ 8,    16],\n        [ 12,    17],\n        [ 18,    8],\n        [ 18,    9],\n        [ 16,    12]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 450,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '90%',\n            'height' =\u003e 400\n        ],\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ],\n        'hAxis' =\u003e [\n            'minValue' =\u003e 0,\n            'maxValue' =\u003e 15\n        ],        \n        'vAxis' =\u003e [\n            'title' =\u003e 'Weight',\n            'titleTextStyle' =\u003e [\n                'fontSize' =\u003e 13,\n                'italic' =\u003e false\n            ],            \n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 10\n            ],\n            'minValue' =\u003e 0,\n            'maxValue' =\u003e 15\n        ],\n        'legend' =\u003e 'none',\n        'pointSize' =\u003e 10,\n        'colors' =\u003e [\n            '#E53935'\n        ]\n    ]\n]) ?\u003e\n```\n\n2) Diff Scatter Chart\n\n![demo](http://img.sbannikov.info/ScatterChartDiff.png)\n```php\n\u003c?= ScatterChart::widget([\n    'id' =\u003e 'my-scatter-diff-chart-id',\n    'data' =\u003e [\n        ['', 'Medicine 1', 'Medicine 2'],\n        [23, null, 12], [9, null, 39], [15, null, 28],\n        [37, null, 30], [21, null, 14], [12, null, 18],\n        [29, null, 34], [ 8, null, 12], [38, null, 28],\n        [35, null, 12], [26, null, 10], [10, null, 29],\n        [11, null, 10], [27, null, 38], [39, null, 17],\n        [34, null, 20], [38, null,  5], [33, null, 27],\n        [23, null, 39], [12, null, 10], [ 8, 15, null],\n        [39, 15, null], [27, 31, null], [30, 24, null],\n        [31, 39, null], [35,  6, null], [ 5,  5, null],\n        [19, 39, null], [22,  8, null], [19, 23, null],\n        [27, 20, null], [11,  6, null], [34, 33, null],\n        [38,  8, null], [39, 29, null], [13, 23, null],\n        [13, 36, null], [39,  6, null], [14, 37, null], [13, 39, null]\n    ],\n    'extraData' =\u003e [\n        ['', 'Medicine 1', 'Medicine 2'],\n        [22, null, 12], [7, null, 40], [14, null, 31],\n        [37, null, 30], [18, null, 17], [9, null, 20],\n        [26, null, 36], [5, null, 13], [36, null, 30],\n        [35, null, 15], [24, null, 12], [7, null, 31],\n        [10, null, 12], [24, null, 40], [37, null, 18],\n        [32, null, 21], [35, null, 7], [31, null, 30],\n        [21, null, 42], [12, null, 10], [10, 13, null],\n        [40, 12, null], [28, 29, null], [32, 22, null],\n        [31, 37, null], [38, 5, null], [6, 4, null],\n        [21, 36, null], [22, 8, null], [21, 22, null],\n        [28, 17, null], [12, 5, null], [37, 30, null],\n        [41, 7, null], [41, 27, null], [15, 20, null],\n        [14, 36, null], [42, 3, null], [14, 37, null], [15, 36, null]\n    ],\n    'options' =\u003e [\n        'fontName' =\u003e 'Verdana',\n        'height' =\u003e 450,\n        'fontSize' =\u003e 12,\n        'chartArea' =\u003e [\n            'left' =\u003e 50,\n            'width' =\u003e '90%',\n            'height' =\u003e 400\n        ],\n        'tooltip' =\u003e [\n            'textStyle' =\u003e [\n                'fontName' =\u003e 'Verdana',\n                'fontSize' =\u003e 13\n            ]\n        ],\n        'hAxis' =\u003e [\n            'minValue' =\u003e 0\n        ],        \n        'vAxis' =\u003e [\n            'gridlines' =\u003e [\n                'color' =\u003e '#e5e5e5',\n                'count' =\u003e 5\n            ],\n            'minValue' =\u003e 0\n        ],\n        'legend' =\u003e [\n            'position' =\u003e 'top',\n            'alignment' =\u003e 'center',\n            'textStyle' =\u003e [\n                'fontSize' =\u003e 12\n            ]\n        ],\n        'diff' =\u003e [\n            'oldData' =\u003e [\n                'opacity' =\u003e 0.5\n            ]\n        ]\n    ]\n]) ?\u003e\n```\n\n## License\n\n**yii2-googlecharts** is released under the BSD 2-Clause License. See the bundled [LICENSE](https://github.com/bsadnu/yii2-googlecharts/blob/master/LICENSE) for details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbsadnu%2Fyii2-googlecharts","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbsadnu%2Fyii2-googlecharts","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbsadnu%2Fyii2-googlecharts/lists"}