OLD GRAMMARIANS SOCIETY
October 20th, 2017
Welcome to your new virtual office of the future
Online office available 24 hours a day / 365 days a year
+123 (212) 456-7890
example@cms-ogslagos.com

Charst & Graphs

[vc_row] [vc_column width="1/1"] [im_messagebox title="Google Charts" container=" Theme comes with Google Charts and Raphael JS Graphs with friendly UI. Create chart and put it in a place everywhere you need it with Visual Composer. Our gallery provides a variety of charts that are optimized to address your data visualization needs. These charts are based on pure HTML5/SVG technology (adopting VML for old IE versions), so no plugins are required. Adding these charts to your page can be done easy with Visual Composer. " frame_color="rgba(128,128,128,.2)" frame_width="4" animation="bottom-to-top"] [vc_column_text css_animation="bottom-to-top"]

Scatter Chart

A scatter chart that is rendered within the browser using SVG or VML. Displays tips when hovering over points. A scatter chart is used to map correlation between sets of numbers.

[/vc_column_text] [im_googlechart type="PointsChart" title="Point Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="450" multiplier="20" h_axis_marks="2009, 2010, 2011, 2012, 2013" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5" indicator_name_2="Apple" indicator_values_2="10,72,82,94,103" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="bottom-to-top"] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/1"] [vc_column_text css_animation="bottom-to-top"]

Large Data

Create incredibly difficult charts with unlimited number of indexes (x & y).

[/vc_column_text] [vc_column_text css_animation="bottom-to-top"]

Line Chart

A line chart that is rendered within the browser using SVG or VML. Displays tips when hovering over points.

[/vc_column_text] [im_googlechart type="LineChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="450" multiplier="20" h_axis_marks="2009, 2010, 2011, 2012, 2013" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5" indicator_name_2="Apple" indicator_values_2="10,72,82,94,103" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="bottom-to-top"] [im_googlechart type="SteppedAreaChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="360" multiplier="10" h_axis_marks="2009, 2010, 2011, 2012, 2013" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5" indicator_name_2="Apple" indicator_values_2="10,72,82,94,103" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="bottom-to-top"] [im_googlechart type="AreaChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="450" multiplier="20" h_axis_marks="2009, 2010, 2011, 2012, 2013" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5" indicator_name_2="Apple" indicator_values_2="10,72,82,94,103" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="bottom-to-top"] [vc_column_text css_animation="bottom-to-top"]

Long Data

Create incredibly difficult charts with unlimited number of indexes (x & y).

[/vc_column_text] [im_googlechart type="LineChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="420" multiplier="2" h_axis_marks="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" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21" indicator_name_2="Apple" indicator_values_2="30.5,50.5,32.5,44,33.5,20,10.6,11,20,21,20.5,50.5,32.5,14,33.5,20,50.6,21,20,21,20.5,40.5,32.5,24,33.5,10,20.6,31,40,61" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="bottom-to-top"] [im_googlechart type="ColumnChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="420" multiplier="2" h_axis_marks="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" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21" indicator_name_2="Apple" indicator_values_2="30.5,50.5,32.5,44,33.5,20,10.6,11,20,21,20.5,50.5,32.5,14,33.5,20,50.6,21,20,21,20.5,40.5,32.5,24,33.5,10,20.6,31,40,61" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33"] [im_googlechart type="BarChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="420" multiplier="2" h_axis_marks="1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21" indicator_name_2="Apple" indicator_values_2="30.5,50.5,32.5,44,33.5,20,10.6,11,20,21,20.5,50.5,32.5,14,33.5,20,50.6,21,20,21,20.5,40.5,32.5,24,33.5,10,20.6,31,40,61" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="top-to-bottom"] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/2"] [im_googlechart type="PieChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="420" multiplier="2" h_axis_marks="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" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21,10.5,50.5,32.5,24,33.5,10,10.6,11,20,21" indicator_name_2="Apple" indicator_values_2="30.5,50.5,32.5,44,33.5,20,10.6,11,20,21,20.5,50.5,32.5,14,33.5,20,50.6,21,20,21,20.5,40.5,32.5,24,33.5,10,20.6,31,40,61" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="Envato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="left-to-right"] [/vc_column] [vc_column width="1/2"] [im_googlechart type="PieChart" title="Linear Charts" h_axis_title="x Axis Title" v_axis_title="y Axis Title" chart_h="450" multiplier="20" h_axis_marks="2009, 2010, 2011, 2012, 2013" indicator_name_1="IBM" indicator_values_1="10.5,50.5,32.5,24,33.5" indicator_name_2="Apple" indicator_values_2="10,72,82,94,103" indicator_name_3="Google" indicator_values_3="20,52,62,74,83" indicator_name_4="Facebook" indicator_values_4="26,42,62,64,63" indicator_name_5="Microsoft" indicator_values_5="10.5,12.5,32.5,24.5,33.5" indicator_name_6="Dell" indicator_values_6="22,32,20.5,24.5,33.5" indicator_name_7="Intel" indicator_values_7="40,42,42,44,53" indicator_name_8="HP" indicator_values_8="30,32,22,24,23.5" indicator_name_9="Acer" indicator_values_9="22,12.5,32,24.5,49" indicator_name_10="Asus" indicator_values_10="20,42,22,54,45" indicator_name_11="AMD" indicator_values_11="8,10,22,24,44.5" indicator_name_12="Samsung" indicator_values_12="50,51,53,52,53" indicator_name_13="HTC" indicator_values_13="11,12,42,24,43" indicator_name_14="Arena" indicator_values_14="10,12,12,14,13" indicator_name_15="Cyrix" indicator_values_15="25,25.5,25,26,26" indicator_name_16="Logic" indicator_values_16="23,50,40,43,13" indicator_name_17="En
vato" indicator_values_17="32,48,23,43,40" indicator_name_18="TMI" indicator_values_18="8,8,18,10,12" indicator_name_19="MSI" indicator_values_19="12,8,32,48,56" indicator_name_20="DDI" indicator_values_20="10,12,32,24,33" animation="right-to-left"] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/1"] [vc_column_text css_animation="bottom-to-top"]

3D Pie Chart

A pie chart (or a circle graph) is a circular chart divided into sectors, illustrating numerical proportion. In a pie chart, the arc length of each sector (and consequently its central angle and area), is proportional to the quantity it represents. While it is named for its resemblance to a pie which has been sliced, there are variations on the way it can be presented. The earliest known pie chart is generally credited to William Playfair’s Statistical Breviary of 1801.

Pie charts are very widely used in the business world and the mass media.[3] However, they have been criticized,[4] and many experts recommend avoiding them,[5] [6] [7] [8] pointing out that research has shown it is difficult to compare different sections of a given pie chart, or to compare data across different pie charts. Pie charts can be replaced in most cases by other plots such as the bar chart.

[/vc_column_text] [im_googlechart type="PieChart3D" title="Pie Chart 3D" h_axis_title="Title x" v_axis_title="Title y" chart_h="450" multiplier="4" h_axis_marks="IBM, HP, DELL, APPLE" indicator_name_1="Item #1" indicator_values_1="12,33,18,1.5" indicator_name_2="Item #2" indicator_values_2="8.5,12,7,20" indicator_name_3="Item #3" indicator_values_3="10,12.5,15.5,11" indicator_name_4="Item #4" indicator_values_4="12,30.5,19,11" animation="scale-up"] [vc_column_text css_animation="bottom-to-top"]

Smooth Line Chart

Line charts can reflect anything. However to display it more dynamically and elegance you might need to use Smooth Line Chart.

[/vc_column_text] [im_googlechart type="LineChartFunction" h_axis_title="Company" v_axis_title="Value" chart_h="540" multiplier="8" h_axis_marks="IBM, HP, DELL, APPLE" indicator_name_1="Item #1" indicator_values_1="120,330,180,105" indicator_name_2="Item #2" indicator_values_2="850,120,70,200" indicator_name_3="Item #3" indicator_values_3="100,1250,1550,110" indicator_name_4="Item #4" indicator_values_4="120,305,1911,313.5" indicator_values_5="100,1250,1550,110" indicator_values_6="120,305,1911,313.5" indicator_values_7="100,1250,1550,110" indicator_values_8="100,1250,1550,110" animation="bottom-to-top"] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/1"] [vc_column_text css_animation="bottom-to-top"]

Candlestick

A candlestick chart is used to show an opening and closing value overlaid on top of a total variance. Candlestick charts are often used to show stock value behavior. In this chart, items where the opening value is less than the closing value (a gain) are drawn as filled boxes, and items where the opening value is more than the closing value (a loss) are drawn as hollow boxes.

[/vc_column_text] [im_googlechart type="CandlestickChart" title="Finances" chart_h="410" h_axis_marks="GOOG, APP, FACEB, NASD, QRM, DFG, INTL" multiplier="8" indicator_values_1="99,189.9,258.5,300,201,259,310,100" indicator_values_2="119,169.9,258.5,300,201,209,300,150" indicator_values_3="199,170.9,250.5,305,211,279,303,120" indicator_values_4="239,180.9,260.5,325,211,289,313,110" indicator_values_5="1,10,20,30,28" disable_legend="true" indicator_values_6="210,175.9,255.5,355,287,299,353,187" indicator_values_7="250,135.9,225.5,385,297,319,373,107" indicator_values_8="99,189.9,258.5,300,201,259,310,102" animation="top-to-bottom"] [vc_column_text css_animation="bottom-to-top"]

Five or more columns, where the first column defines X-axis values or group labels, and each multiple of four data columns after that defines a different series.

  • Col 0: String (discrete) used as a group label on the X axis, or number, date, datetime or timeofday (continuous) used as a value on the X axis.
  • Col 1: Number specifying the low/minimum value of this marker. This is the base of the candle’s center line. The column label is used as the series label in the legend (while the labels of the other columns are ignored).
  • Col 2: Number specifying the opening/initial value of this marker. This is one vertical border of the candle. If less than the column 3 value, the candle will be filled; otherwise it will be hollow.
  • Col 3: Number specifying the closing/final value of this marker. This is the second vertical border of the candle. If less than the column 2 value, the candle will be hollow; otherwise it will be filled.
  • Col 4: Number specifying the high/maximum value of this marker. This is the top of the candle’s center line.
  • Col 5 [Optional]: A tooltip for the candlestick.
[/vc_column_text] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/2"] [im_googlechart type="CandlestickChart" title="Finances" chart_h="410" h_axis_marks="Mon, Tue, Wed, Thu, Fri" multiplier="4" indicator_values_1="5,10,20,30,25" indicator_values_2="15,12,24,33,20" indicator_values_3="5,30,18,12,20" indicator_values_4="10,19,26,31,20" indicator_values_5="1,10,20,30,28" disable_legend="true" animation="left-to-right"] [/vc_column] [vc_column width="1/2"] [im_googlechart type="CandlestickChart" title="Finances" chart_h="410" h_axis_marks="Mon, Tue, Wed, Thu, Fri" multiplier="4" indicator_values_1="5,10,20,30,25" indicator_values_2="15,12,24,33,20" indicator_values_3="5,30,18,12,20" indicator_values_4="10,19,26,31,20" indicator_values_5="1,10,20,30,28" disable_legend="true" animation="right-to-left"] [/vc_column] [/vc_row] [vc_row] [vc_column width="1/1"] [vc_column_text css_animation="bottom-to-top"]

Backend & UI

Take a look this short clip how to manage charts with our theme admin UI.

[/vc_column_text] [vc_video title="Backend & UI" link="http://youtu.be/BmbhORBUWHA"] [vc_column_text]

Engine

You don’t need more add large code to reach required results. Our shortcode will create it for you with unique ID. Unique ID means that you may use unlimited count of charts, mixing it on a single page.

[/vc_column_text] [vc_column_text css_animation="bottom-to-top"]

Need some proofs?

  jQuery(document).ready(function () {
      var chart_12_width = jQuery("#chart_12").parent().width();
      jQuery("#chart_12").css("width", chart_12_width + "px");
  });
  google.load("visualization", "1", {
      packages: ["corechart"]
  });
  google.setOnLoadCallback(drawChart);

  function drawChart() {
      var data = google.visualization.arrayToDataTable([
          ["", "", "", "", ""],
          ["Mon", 5, 15, 5, 10],
          ["Tue", 10, 12, 30, 19],
          ["Wed", 20, 24, 18, 26],
          ["Thu", 30, 33, 12, 31],
          ["Fri", 25, 20, 20, 20]
      ]);
      var options = {
          title: "Finances",
          vAxis: {
              title: ""
          },
          hAxis: {
              title: ""
          },
          is3D: true,
          backgroundColor: "transparent",
          pointSize: 4,
          legend: "none",
      };

      var chart = new google.visualization.CandlestickChart(document.getElementById("chart_12"));
      chart.draw(data, options);
  }
[/vc_column_text] [/vc_column] [/vc_row]

Members Company

Innovation and Excellence