在线时间:8:00-16:00
迪恩网络APP
随时随地掌握行业动态
扫描二维码
关注迪恩网络微信公众号
开源软件名称(OpenSource Name):mattetti/googlecharts开源软件地址(OpenSource Url):https://github.com/mattetti/googlecharts开源编程语言(OpenSource Language):Ruby 100.0%开源软件介绍(OpenSource Introduction):GooglechartsThe goal of this Gem is to make the creation of Google Charts a simple and easy task.
Check out the full documentation over there This gem is fully tested using Rspec, check the rspec folder for more examples. See at the bottom of this file who reported using this gem. Chart TypeThis gem supports the following types of charts:
Googlecharts also supports graphical themes and you can easily load your own. To create a chart, simply require Gchart and call any of the existing type:
Chart TitleTo add a title to a chart pass the title to your chart:
You can also specify the color and/or size
ColorsSpecify a color with at least a 6-letter string of hexadecimal values in the format RRGGBB. For example:
You can optionally specify transparency by appending a value between 00 and FF where 00 is completely transparent and FF completely opaque. For example:
If you need to use multiple colors, check the doc. Usually you just need to pass :attribute => 'FF0000,00FF00' Some charts have more options than other, make sure to refer to the documentation. Background options:If you don't set the background option, your graph will be transparent.
By default, if you set a background color, the fill will be solid:
However you can specify another fill type such as:
In the above code, we decided to have a gradient background, however since we only passed one color, the chart will start by the specified color and transition to white. By the default, the gradient angle is 0. Change it as follows:
For a more advance use of colors, refer to http://code.google.com/apis/chart/#linear_gradient
The same way you set the background color, you can also set the graph background:
or both
Another type of fill is stripes http://code.google.com/apis/chart/#linear_stripes
You can customize the amount of stripes, colors and width by changing the color value. ThemesGooglecharts comes with 4 themes: keynote, thirty7signals, pastel and greyscale. (ganked from Gruff
You can also use your own theme. Create a yml file using the same format as the themes located in lib/themes.yml Load your theme(s):
And use the standard method signature to use your own theme:
Legend & LabelsYou probably will want to use a legend or labels for your graph.
or Gchart.line(:legend => ['legend label 1', 'legend label 2']) Will do the trick. You can also use the labels alias (makes more sense when using the pie charts)
Multiple axis labelsMultiple axis labels are available for line charts, bar charts and scatter plots.
To add labels on these axis:
Note that each array entry could also be an array but represent the labels for the corresponding axis. A question which comes back often is how do I only display the y axis label? Solution:
Custom axis rangesIf you want to display a custom range for an axis, you need to set the range as described in the Google charts documentation: min, max, step:
In this case, the custom axis range is only defined for y (second entry) with a minimum value of 2, max 17 and a step of 5. This is also valid if you want to set a x axis and automatically define the y labels. Data optionsData are passed using an array or a nested array.
By default, the graph is drawn with your max value representing 100% of the height or width of the graph. You can change that my passing the max value.
or if you want to use the real values from your dataset:
You can also define a different encoding to add more granularity:
Pies:you have 2 type of pies:
To set labels, you can use one of these two options:
Bars:A bar chart can accept options to set the width of the bars, spacing between bars and spacing between bar groups. To set these, you can either provide a string, array or hash. The Google API sets these options in the order of width, spacing, and group spacing, with both spacing values being optional. So, if you provide a string or array, provide them in that order:
The hash lets you set these values directly, with the Google default values set for any options you don't include:
Radar:
Sparklines:A sparkline chart has exactly the same parameters as a line chart. The only difference is that the axes lines are not drawn for sparklines by default. Google-o-meterA Google-o-meter has a few restrictions. It may only use a solid filled background and it may only have one label. Record Chart PNG file in filesystem Sample :Multi Lines Chart Sample :
try yourself
|
2023-10-27
2022-08-15
2022-08-17
2022-09-23
2022-08-13
请发表评论