If you are new to Joomla, you can check our detail guide of how to install extensions in your Joomla site. This guide shows you not only how to install extensions but also how to set up the new installed extensions.
Open module setting panel, in the detail tab, publish the module then assign to a position
In the "Menu Assignment", tick on the menu items that you want to display the module on.
There are 3 ways to add data for your Google chart: input data, upload data, get data from an SVC file.
Input data in the data field, the input data should follow format as in your data file:
Year,Sales,Revenue 2007,1000,20000 2008,1450,32500 2009,2312,54234 2010,4390,129870 2011,5690,158456 2012,7981,216783 2013,8534,230024
Upload and Import
You can upload and import data from a CSV file.
Get CSV file from Google Docs
If your data file is in Google docs, you can save as to your local then import to JA Google chart module.
Now import the CSV file to Google chart module
Get data from URL
Please keep in mind that the module only accept CSV file.
Get CSV link from Google Docs
In your Google docs file, go to: File >> Publish to the web
Now paste the link to field: Data URL in the module back-end.
Chart types setting
JA Google Chart supports up to 5 chart types: bar, column, line, area, geo and pie.
The GEO chart and Pie chart has extended settings.
Data Source setting
As we mentioned above, the module supports 3 ways to get data for your charts. For more detail, please check Data Format section.
You can configure size of the charts, the size settings include container size, chart size and left, top padding.
If you want the module to be responsive, you will need to use % instead of pixel to set the container width.
Chart Title, Legend and Tooltip Setting
- Chart title: add title for your charts then configure its font family, size and color
- Chart legend: set position for chart legend then configure fonts settings
- Chart tooltip: enable or disable tooltip when hovering points in charts
That is a group for configuration settings of axis based chart such as area chart, bar chart, column chart and line chart settings
- Line width: set the width for line in charts (in pixel)
- Horizontal Axis: settings for horizontal axis in charts - axis title, font settings (font family, font size, color), text position, direction
- Veritcal Axis: settings for verical axis in charts - axis title, font settings (font family, font size, color), text position, direction
Pie Chart Settings
The setting is only applied when you select Chart Type is Pie Chart in the basic settings. If not, you don't need to configure Pie chart settings.
- 3D chart: it's the display mode of pie chart. If you enable, your pie chart will be 3D view, other wise it's 2D view.
- Slice border color: select color for slice border of pie chart, it is only applied when your chart is 2 dimensional.
- Slice Text: set display mode of slice text (percentage, value, or label) then change its font settings.
GEO Chart Settings
The setting is only applied when you select Chart Type is GEO Chart in the basic settings. If not, you don't need to configure Pie chart settings.
The module supports 3 modes: Region Map, Marker Map and Auto that base on the format of your data.
GEO Chart type: Region Map
GEO Chart type: Marker Map
Configure the region that will be displayed in your chart, it can be one of the following:
- world: a map of the entire word
- A continent or a sub-continent: it's specified by its 3-digit code. For example, "001" for Western Africa.
- A country: specified by its ISO 3166-1 alpha-2 code. For example: "AU" for Australia.
- A State in United States: specified by uts ISO 3166-2:US code. For example, "US-AL" for Alabama. Please keep in mind that the resolution option must be set to either "Provinces" or "Metros".
Continent Hierarchy and Codes
||DZ, EG, EH, LY, MA, SD, TN|
||BF, BJ, CI, CV, GH, GM, GN, GW, LR, ML, MR, NE, NG, SH, SL, SN, TG|
||AO, CD, ZR, CF, CG, CM, GA, GQ, ST, TD|
||BI, DJ, ER, ET, KE, KM, MG, MU, MW, MZ, RE, RW, SC, SO, TZ, UG, YT, ZM, ZW|
||BW, LS, NA, SZ, ZA|
||GG, JE, AX, DK, EE, FI, FO, GB, IE, IM, IS, LT, LV, NO, SE, SJ|
||AT, BE, CH, DE, DD, FR, FX, LI, LU, MC, NL|
||BG, BY, CZ, HU, MD, PL, RO, RU, SU, SK, UA|
||AD, AL, BA, ES, GI, GR, HR, IT, ME, MK, MT, CS, RS, PT, SI, SM, VA, YU|
||BM, CA, GL, PM, US|
||AG, AI, AN, AW, BB, BL, BS, CU, DM, DO, GD, GP, HT, JM, KN, KY, LC, MF, MQ, MS, PR, TC, TT, VC, VG, VI|
||BZ, CR, GT, HN, MX, NI, PA, SV|
||AR, BO, BR, CL, CO, EC, FK, GF, GY, PE, PY, SR, UY, VE|
||TM, TJ, KG, KZ, UZ|
||CN, HK, JP, KP, KR, MN, MO, TW|
||AF, BD, BT, IN, IR, LK, MV, NP, PK|
||BN, ID, KH, LA, MM, BU, MY, PH, SG, TH, TL, TP, VN|
||AE, AM, AZ, BH, CY, GE, IL, IQ, JO, KW, LB, OM, PS, QA, SA, NT, SY, TR, YE, YD|
||AU, NF, NZ|
||FJ, NC, PG, SB, VU|
||FM, GU, KI, MH, MP, NR, PW|
||AS, CK, NU, PF, PN, TK, TO, TV, WF, WS|