{"id":13463213,"url":"https://github.com/winston/google_visualr","last_synced_at":"2025-05-15T17:09:37.261Z","repository":{"id":864532,"uuid":"601109","full_name":"winston/google_visualr","owner":"winston","description":"A Ruby Gem for the Google Visualization API. Write Ruby code. Generate Javascript. Display a Google Chart.","archived":false,"fork":false,"pushed_at":"2021-05-05T20:54:27.000Z","size":332,"stargazers_count":427,"open_issues_count":18,"forks_count":92,"subscribers_count":20,"default_branch":"master","last_synced_at":"2025-05-13T19:26:04.783Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":"http://googlevisualr.heroku.com","language":"Ruby","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/winston.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":"CONTRIBUTING.md","funding":null,"license":"MIT-LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2010-04-08T17:14:30.000Z","updated_at":"2025-02-14T03:06:42.000Z","dependencies_parsed_at":"2022-07-05T19:00:23.667Z","dependency_job_id":null,"html_url":"https://github.com/winston/google_visualr","commit_stats":null,"previous_names":[],"tags_count":12,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston%2Fgoogle_visualr","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston%2Fgoogle_visualr/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston%2Fgoogle_visualr/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/winston%2Fgoogle_visualr/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/winston","download_url":"https://codeload.github.com/winston/google_visualr/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":254384989,"owners_count":22062422,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","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":[],"created_at":"2024-07-31T13:00:48.205Z","updated_at":"2025-05-15T17:09:32.252Z","avatar_url":"https://github.com/winston.png","language":"Ruby","readme":"# GoogleVisualr\n\n[![Gem Version](http://img.shields.io/gem/v/google_visualr.svg?style=flat-square)](https://rubygems.org/gems/google_visualr)\n[![Build Status](http://img.shields.io/travis/winston/google_visualr.svg?style=flat-square)](https://travis-ci.org/winston/google_visualr)\n[![License](http://img.shields.io/:license-mit-blue.svg?style=flat-square)](https://github.com/winston/google_visualr/blob/master/MIT-LICENSE)\n\nGoogleVisualr, is a wrapper around the [Google Charts](https://developers.google.com/chart/) that allows anyone to create beautiful charts with just plain Ruby. You don't have to write any JavaScript at all.\n\nIt's good for any Ruby (Rails/Sinatra) setup, and you can handle the entire charting logic in Ruby.\n\nPlease refer to the [GoogleVisualr API Reference site](http://googlevisualr.herokuapp.com/) for a complete list of Google charts that you can create with GoogleVisualr.\n\n## tl:dr\n\n* In your model or controller, write Ruby code to create your chart (e.g. Area Chart, Bar Chart etc).\n* Configure your chart with any of the options as listed in Google's API Docs. E.g. [Area Chart](http://code.google.com/apis/chart/interactive/docs/gallery/areachart.html#Configuration_Options).\n* In your view, call `chart.to_js(div_id)` and that renders JavaScript into the HTML output.\n* You get your awesome Google chart, and you didn't write any JavaScript!\n\n## Limitations\n\nGoogleVisualr is not a 100% complete wrapper for Google Chart Tools.\n\n`Methods` and `Events` as described in Google's API Docs - for use after a chart has been rendered, \nare not implemented because they feel more natural being written as JavaScript functions, within the views or .js files.\n\n## Install\n\nAssuming you are on Rails 3/4, include the gem in your Gemfile.\n\n    gem \"google_visualr\", \"\u003e= 2.5\"\n\n## Basics\n\nThis is a basic implementation of `GoogleVisualr::DataTable` and `GoogleVisualr::AreaChart`.\n\nFor detailed documentation, please refer to the [GoogleVisualr API Reference](http://googlevisualr.herokuapp.com/) or [read the source](https://github.com/winston/google_visualr_app).\n\n---\n\nIn your Rails layout, load Google Ajax API in the head tag, at the very top.\n\n    \u003cscript src='https://www.google.com/jsapi'\u003e\u003c/script\u003e\n\nIn your Rails controller, initialize a GoogleVisualr::DataTable object with an empty constructor.\n\n    data_table = GoogleVisualr::DataTable.new\n\nPopulate data_table with column headers, and row values.\n\n\t# Add Column Headers\n\tdata_table.new_column('string', 'Year' )\n\tdata_table.new_column('number', 'Sales')\n\tdata_table.new_column('number', 'Expenses')\n\n\t# Add Rows and Values\n\tdata_table.add_rows([\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\nCreate a GoogleVisualr::AreaChart with data_table and configuration options.\n\n\toption = { width: 400, height: 240, title: 'Company Performance' }\n\t@chart = GoogleVisualr::Interactive::AreaChart.new(data_table, option)\n\nIn your Rails view, render the Google chart.\n\n\t\u003cdiv id='chart'\u003e\u003c/div\u003e\n\t\u003c%= render_chart(@chart, 'chart') %\u003e\n\n## Chart Initializer\n\nThe initializer of `GoogleVisualr::\u003cChartName\u003e` takes in two parameters: `data_table` and `options`.\n\n### `data_table` \n\n`data_table` is an instance of `GoogleVisualr::DataTable` and contains headers and rows of data.\n\n### `options`\n\n`options` is a hash of configuration options for the Google chart (e.g. width, height, colors etc). \n\nThe available configuration options are exactly the same as those specified in Google's API Docs.\n\nFor example: \n- [Configuration options for AreaChart](https://developers.google.com/chart/interactive/docs/gallery/areachart#configuration-options)\n- [Configuration options for BarChart](https://developers.google.com/chart/interactive/docs/gallery/barchart#configuration-options)\n \nAt the same time, you can also specify `version`, `language` and `material` as configuration options.\n\n#### `version`\n\nThe default version of Google Charts library loaded is `1.0`. \n\nHowever, some charts (e.g. Gantt Charts) require the latest version of the Google Charts library,\nso you will have to specify `version` as `1.1` in the configuration options \n\n```\n....\n@chart = GoogleVisualr::GanttChart.new(data_table, { version: '1.1' })\n```\n\n[Read more about it on Google's API Docs](https://developers.google.com/chart/interactive/docs/basic_load_libs).\n\n#### `language` \n\nThe default locale of all Google Charts is `en`.\n \nYou can override this default by specifying `language` in the configuration options.\n\n```\n....\n@chart = GoogleVisualr::BarChart.new(data_table, { language: 'ja' })\n```\n\n[Read more about it on Google's API Docs](https://developers.google.com/chart/interactive/docs/library_loading_enhancements#loadwithlocale).\n\n#### `material`\n\nGoogle has also enabled `Material` design for some charts:\n\n\u003e In 2014, Google announced guidelines intended to support a common look and feel across its properties and apps (such as Android apps) that run on Google platforms. We call this effort Material Design. We'll be providing \"Material\" versions of all our core charts; you're welcome to use them if you like how they look.\n\nTo use material design, you will have to specify `material` as `true` \nin the configuration options.\n\n```\n....\n@chart = GoogleVisualr::BarChart.new(data_table, { material: true })\n```\n\n## Listeners\n\nFor an example usage of `listeners`, please refer to [this comment](https://github.com/winston/google_visualr/issues/36#issuecomment-9880256).\n\nBesides `listeners` you can now also redraw charts in your JavaScript maunally by calling `draw_\u003celement id\u003e()` function. See [this commit](https://github.com/winston/google_visualr/commit/e5554886bd83f56dd31bbc543fdcf1e24523776a) for more details.\n\n## Support\n\nPlease submit all feedback, bugs and feature-requests to [GitHub Issues Tracker](http://github.com/winston/google_visualr/issues).\n\nFeel free to fork the project, make improvements or bug fixes and submit pull requests (with tests!).\n\n## Who's Using GoogleVisualr?\n\nI would like to collect some data about who's using this Gem. [Please drop me a line](mailto:winstonyw+googlevisualr@gmail.com).\n\n## Author\n\nGoogleVisualr is maintained by [Winston Teo](mailto:winstonyw+googlevisualr@gmail.com).\n\nWho is Winston Teo? [You should follow Winston on Twitter](http://www.twitter.com/winstonyw), or find out more on [WinstonYW](http://www.winstonyw.com).\n\n## License\n\nCopyright © 2015 Winston Teo Yong Wei. Free software, released under the MIT license.\n","funding_links":[],"categories":["Graphics"],"sub_categories":["Graphing"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwinston%2Fgoogle_visualr","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwinston%2Fgoogle_visualr","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwinston%2Fgoogle_visualr/lists"}