Charts

[vc_row ancho_completo=”fila_estirada” paralaje=”movimiento de contenido” css=”.vc_custom_1430236698110{tapa acolchada: 35píxeles !importante;fondo acolchado: 60píxeles !importante;imagen de fondo: URL(http://vcpreview.com/80e7cd25e63ecf743e404978/wp-content/uploads/sites/23273/2015/01/background_flat.png?identificación=23) !importante;posición de fondo: centro;repetición de fondo: no repetir;tamaño de fondo:cubrir;}”][columna_vc][vc_custom_heading texto=”Charts” fuente_contenedor=”etiqueta:h2|tamaño_fuente:46|alineación_texto:izquierda|color:%23ffffff|altura_linea:1.5″ fuentes_google=”familia_fuente:Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic|estilo_fuente:700%20negrita regular:700:normal”][alineación vc_separator =”alinear_izquierda” ancho_borde=”3″ el_ancho=”50″ el_class=”separador-en-título”][vc_columna_texto css=”.vc_custom_1437482984436{margen superior: -15píxeles !importante;}”]Display your data using progress bar, line, round or pie charts.[/vc_column_text][/columna_vc][/vc_row][vc_row][columna_vc][vc_custom_heading texto=”Progress Bar” fuente_contenedor=”etiqueta:h3|tamaño_fuente:38|alineación_texto:centro|color:%233a3a3a|altura_linea:1.2″ fuentes_google=”familia_fuente:Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic|estilo_fuente:400%20regular:400:normal” css=”.vc_custom_1422968391755{fondo acolchado: 15píxeles !importante;}”][vc_column_text]

Progress Bar content element allows displaying your skills in a well crafted bars backed up with fancy CSS animation to perfectly drag attention of your customers.

[/vc_column_text][/columna_vc][/vc_row][vc_rowcss=”.vc_custom_1422959791599{fondo acolchado: 35píxeles !importante;}”][vc_columna ancho=”1/2″][vc_progress_bar bgcolor=”bar_red”][vc_progress_bar bgcolor=”bar_turquoise” units=”%”][/columna_vc][vc_columna ancho=”1/2″][vc_progress_bar bgcolor=”bar_blue” options=”striped,animated”][vc_progress_bar values=”90|Desarrollo|#e6ed90,80|Design|#8de8e2,70|Marketing|#cb8de8″ bgcolor=”costumbre” options=”striped,animated” custombgcolor=”#cb8de8″][/columna_vc][/vc_row][vc_row ancho_completo=”stretch_row_content_no_spaces”][columna_vc][vc_separador][/columna_vc][/vc_row][vc_row][columna_vc][vc_custom_heading texto=”Gráfico circular” fuente_contenedor=”etiqueta:h3|tamaño_fuente:38|alineación_texto:centro|color:%233a3a3a|altura_linea:1.2″ fuentes_google=”familia_fuente:Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic|estilo_fuente:400%20regular:400:normal” css=”.vc_custom_1422968736831{fondo acolchado: 15píxeles !importante;}”][vc_column_text]

Pie Chart content element allows displaying of your data by using fancy pie chart with easy to modify colors, values and labels.

[/vc_column_text][/columna_vc][/vc_row][vc_rowcss=”.vc_custom_1422959791599{fondo acolchado: 35píxeles !importante;}”][vc_columna ancho=”1/4″][vc_pie value=”10″ label_value=”10″ color =”btn-primary” units=”%”][/columna_vc][vc_columna ancho=”1/4″][vc_pie value=”25″ label_value=”25″ color =”btn-success” units=”%”][/columna_vc][vc_columna ancho=”1/4″][vc_pie label_value=”50″ color =”btn-warning” units=”%”][/columna_vc][vc_columna ancho=”1/4″][vc_pie value=”75″ label_value=”75″ color =”btn-danger” units=”%”][/columna_vc][/vc_row][vc_row ancho_completo=”stretch_row_content_no_spaces”][columna_vc][vc_separador][/columna_vc][/vc_row][vc_row][columna_vc][vc_custom_heading texto=”Round Charts – Doughnut and Pie” fuente_contenedor=”etiqueta:h3|tamaño_fuente:38|alineación_texto:centro|color:%233a3a3a|altura_linea:1.2″ fuentes_google=”familia_fuente:Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic|estilo_fuente:400%20regular:400:normal” css=”.vc_custom_1435764795309{fondo acolchado: 15píxeles !importante;}”][vc_column_text]

Round chart offers 2 new types of charts – Doughnut and Pie with multiple styling and animation preset options. Control colors, gaps and much more easily.

[/vc_column_text][/columna_vc][/vc_row][vc_rowcss=”.vc_custom_1422959791599{fondo acolchado: 35píxeles !importante;}”][vc_columna ancho=”1/3″][vc_round_chart type=”doughnut” stroke_width=”2″][/columna_vc][vc_columna ancho=”1/3″][vc_round_chart type=”doughnut” stroke_width=”2″ values=”%5B%7B%22title%22%3A%22One%22%2C%22value%22%3A%2260%22%2C%22color%22%3A%22violet%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22value%22%3A%2240%22%2C%22color%22%3A%22sandy-brown%22%7D%2C%7B%22title%22%3A%22Three%22%2C%22value%22%3A%2250%22%2C%22color%22%3A%22chino%22%2C%22custom_color%22%3A%22%23cec2ab%22%7D%5D” animation=”easeOutQuart”][/columna_vc][vc_columna ancho=”1/3″][vc_round_chart stroke_width=”0″ values=”%5B%7B%22title%22%3A%22One%22%2C%22value%22%3A%2260%22%2C%22color%22%3A%22turquoise%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22value%22%3A%2210%22%2C%22color%22%3A%22green%22%2C%22custom_color%22%3A%22%23cec2ab%22%7D%5D” animation=”easeOutBounce”][/columna_vc][/vc_row][vc_rowcss=”.vc_custom_1422959791599{fondo acolchado: 35píxeles !importante;}”][vc_columna ancho=”1/3″][vc_round_chart style=”costumbre” stroke_width=”5″ legend=”” values=”%5B%7B%22title%22%3A%22Two%22%2C%22value%22%3A%2240%22%2C%22color%22%3A%22pink%22%2C%22custom_color%22%3A%22%23ead620%22%7D%2C%7B%22title%22%3A%22One%22%2C%22value%22%3A%2260%22%2C%22color%22%3A%22blue%22%2C%22custom_color%22%3A%22%23b972c9%22%7D%5D” animation=”easeOutQuart”][/columna_vc][vc_columna ancho=”1/3″][vc_round_chart type=”doughnut” stroke_width=”2″ legend=”” values=”%5B%7B%22title%22%3A%22One%22%2C%22value%22%3A%2260%22%2C%22color%22%3A%22pink%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22value%22%3A%2250%22%2C%22color%22%3A%22orange%22%2C%22custom_color%22%3A%22%23cec2ab%22%7D%5D”][/columna_vc][vc_columna ancho=”1/3″][vc_round_chart type=”doughnut” estilo =”modern” stroke_width=”0″ legend=”” values=”%5B%7B%22title%22%3A%22One%22%2C%22value%22%3A%2225%22%2C%22color%22%3A%22sky%22%7D%2C%7B%22title%22%3A%22Three%22%2C%22value%22%3A%2255%22%2C%22color%22%3A%22vista-blue%22%2C%22custom_color%22%3A%22%23cec2ab%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22value%22%3A%2235%22%2C%22color%22%3A%22purple%22%2C%22custom_color%22%3A%22%23f4524d%22%7D%5D” animation=”easeOutBack”][/columna_vc][/vc_row][vc_row ancho_completo=”stretch_row_content_no_spaces”][columna_vc][vc_separador][/columna_vc][/vc_row][vc_row][columna_vc][vc_custom_heading texto=”Line and Bar Charts” fuente_contenedor=”etiqueta:h3|tamaño_fuente:38|alineación_texto:centro|color:%233a3a3a|altura_linea:1.2″ fuentes_google=”familia_fuente:Lato:100,100italic,300,300italic,regular,italic,700,700italic,900,900italic|estilo_fuente:400%20regular:400:normal” css=”.vc_custom_1435764769557{fondo acolchado: 15píxeles !importante;}”][vc_column_text]

Line and Bar charts allows creating vertical charts with X and Y axis. Control colors, legend and much more.

[/vc_column_text][/columna_vc][/vc_row][vc_rowcss=”.vc_custom_1422959791599{fondo acolchado: 35píxeles !importante;}”][vc_columna ancho=”1/2″][vc_line_chart type=”line” values=”%5B%7B%22title%22%3A%22One%22%2C%22y_values%22%3A%2210%3B%2015%3B%2020%3B%2025%3B%2027%3B%2025%3B%2023%3B%2025%22%2C%22color%22%3A%22blue%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22y_values%22%3A%2225%3B%2018%3B%2016%3B%2017%3B%2020%3B%2025%3B%2030%3B%2035%22%2C%22color%22%3A%22pink%22%7D%5D” animation=”easeOutBack”][/columna_vc][vc_columna ancho=”1/2″][vc_line_chart values=”%5B%7B%22title%22%3A%22One%22%2C%22y_values%22%3A%2210%3B%2015%3B%2020%3B%2025%3B%2027%3B%2025%3B%2023%3B%2025%22%2C%22color%22%3A%22sandy-brown%22%7D%2C%7B%22title%22%3A%22Two%22%2C%22y_values%22%3A%2225%3B%2018%3B%2016%3B%2017%3B%2020%3B%2025%3B%2030%3B%2035%22%2C%22color%22%3A%22vista-blue%22%7D%2C%7B%22title%22%3A%22Three%22%2C%22y_values%22%3A%2235%3B%2032%3B%2045%3B%2025%3B%2025%3B%2015%3B%2030%3B%2026%22%2C%22color%22%3A%22chino%22%2C%22custom_color%22%3A%22%23ebebeb%22%7D%5D” animation=”easeinQuad”][/columna_vc][/vc_row]