Nota: Si bien hemos traducido las guías más populares al español, algunas guías están disponibles solamente en inglés.
Usar los Bloques de gráficos

Usa un Bloque de gráfico para crear visualizaciones de datos en tu sitio. Los gráficos son fabulosos para explicar las relaciones entre las diferentes series de datos de manera convincente. Puedes crear y cambiar el estilo de Gráficos de barras, Gráficos de líneas y Gráficos de torta.

Chart Blocks are a good alternative to embedding static images of charts created in programs outside of Squarespace. The charts responsively resize to ensure they look great in multiple screen sizes, and you can update the data any time.

Antes de comenzar

We recommend preparing data in a .csv in a spreadsheet program like Excel or Google Sheets. Ensure that columns and rows have headers so they translate easily into headers in the block.

Añade un Bloque de gráfico

Para añadir un Bloque de gráfico:

  1. Presiona Editar en una página o en una publicación.
  2. Presiona un punto de inserción o el icono +. Si necesitas más detalles sobre estos primeros pasos, consulta Agregar bloques.
  3. Selecciona Gráfico de barras, Gráfico de líneas o Gráfico de tortas. Se abre el editor de gráficos y aparece una vista previa del gráfico con contenido del marcador de posición.

Opciones del Bloque de gráfico en el menú de bloques.

  1. Usa las pestañas Datos o Importar/Exportar para añadir datos.
  2. Usa la pestaña Diseño para diseñar el gráfico.
  3. Haz clic en Aplicar para guardar tus cambios.

Si necesitas pasos más detallados, visita las secciones que siguen.

Diseños del Bloque de gráfico

Estos son algunos ejemplos de cada diseño del Bloque de gráfico. Puedes cambiar el diseño en la pestaña Diseño del Bloque de gráfico. Cuando selecciones un diseño, verás su vista previa en la página. Tal vez sea necesario que cambies el formato de tus datos para que se adapten mejor al nuevo diseño.

BarrasLíneasTorta

Los gráficos de barras se utilizan, generalmente, para comparar valores o para controlar los cambios a lo largo del tiempo. Este Bloque de gráfico de barras muestra las ventas de entradas por ubicación durante tres meses. Cada color de barra representa un año distinto.Ejemplo de un Bloque de gráfico de barras.

Los gráficos de líneas, generalmente, se usan para mostrar los cambios a lo largo del tiempo. Con múltiples líneas, puedes comparar los cambios entre distintos temas. Este Bloque de gráfico de líneas muestra las inscripciones durante seis meses. Cada línea representa a un año distinto.

Ejemplo de un Bloque de gráfico de líneas.

Los gráficos de torta se utilizan, generalmente, para comparar cifras de encuestas, preferencias o porcentajes con los datos representados como "porciones" de la torta. Este Bloque de gráfico de torta muestra las tortas favoritas según los resultados de una encuesta.

Ejemplo de un Bloque de gráfico de torta.

Añadir datos

Después de seleccionar tu tipo de gráfico, puedes usar la pestaña Importar/Exportar para importar los datos de un archivo .csv o la pestaña Datos para añadir los datos manualmente.

Note: You can add up to 25 rows and 25 columns. Enter numbers only. The editor converts all dollar signs ($) to 0s.

Option 1 - Copy data from a .csv

Si tienes una hoja de cálculo de datos, puedes copiarlos y pegarlos desde un archivo .csv con texto plano. Recomendamos este método, especialmente si tienes muchos datos y estás familiarizado con la creación de hojas de cálculo en Excel o en Google Sheets.

Tip: In your spreadsheet program, use column and row headers to create labels for the chart. You’ll then open the .csv in a plain text editor since the block can’t import cells from a spreadsheet.
  1. Mantén abierto el editor de Bloque de gráfico.
  2. In your spreadsheet program, save your data as a .csv file.
  3. Open the file in a plain text editor like Notepad or TextEdit.
  4. Select all and copy the text.
  5. En el editor de bloques, presiona la pestaña Importar/Exportar.
  6. Borra los datos de marcadores de posición en la casilla Datos del gráfico.
  7. Paste the text you copied from the .csv.
  8. Presiona Actualizar y, a continuación, Confirmar en el mensaje que aparece.
  9. The chart preview will refresh with new data.

Los datos de la pestaña Importar/Exportar deben lucir de manera similar a esto:

Ejemplo de formato de datos importados en el editor de bloques.

Option 2 - Enter or edit data manually

Puedes crear el gráfico desde cero ingresando las filas de a una en el editor de bloques. Usa esta opción si no tienes datos existentes o si el gráfico será relativamente simple. También puedes seguir estos pasos para editar los datos después de importarlos.

  1. En la pestaña Datos del editor de bloques, elimina las filas de marcadores de posición arrastrándolas y soltándolas en la papelera que aparece.
  2. Presiona el icono + cerca de la parte superior derecha para agregar nuevas columnas y encabezados de columnas. Los Bloques de gráfico de torta solo pueden tener dos columnas.
  3. Haz clic en el icono + cerca de la parte inferior izquierda para añadir nuevas filas y nuevos encabezados.
  4. Haz clic en una celda para ingresar datos nuevos o reemplazar datos de marcadores de posición. Completa todas las celdas. A medida que ingreses los datos, se actualizará la vista previa del gráfico.
Tip: Navigate between cells and rows with the Tab key, just like in any spreadsheet program.
  1. Marca Cambiar los ejes X e Y para modificar la manera en la que se analizan los datos. No recomendamos hacerlo para los Bloques de gráfico de torta.

Consejos de formato

El formato que puedes darles a tus datos podría depender del tipo de Bloque de gráfico que uses. Para informarte mejor sobre el formato de cada gráfico, sigue estos consejos.

BarrasLíneasTorta

Cada fila de los Bloques del gráfico de barra representa una barra o tema en el eje X del gráfico. Por lo general, esto se reserva para los principales temas que estás comparando.

En los Bloques de gráfico de barras, cada fila representa un tema en el eje X.

Cada columna nueva representa la medición que estás comparando entre los temas. Cada columna nueva crea una sección vertical nueva en el gráfico.

Si deseas hacer una comparación simple entre los temas, añade una columna para crear una barra para cada uno. Si quieres entablar varias comparaciones entre los temas, agrega varias columnas.

Con múltiples columnas, los Bloques de gráfico de barra pueden entablar varias comparaciones entre los temas.

Otros consejos

  • No es posible crear un gráfico de barras apiladas en este momento.
  • No se puede cambiar la posición del título, la leyenda y el epígrafe dentro del bloque.
  • Para cambiar el tamaño de los Bloques de gráfico de barras, consulta Cambiar el tamaño de los bloques.
  • En tu sitio activo, los consejos de las herramientas aparecen cuando posicionas el cursor para mostrar los detalles del punto de datos.

El eje X (creado por las filas) de los Bloques de gráfico de líneas se usa, generalmente, para los intervalos. Cada fila de tus datos crea un intervalo nuevo en el gráfico.

Los Bloques de gráfico de líneas usan el eje X para intervalos.

El eje Y (creado por las columnas), por lo general, se reserva para el valor que estás controlando en el transcurso del tiempo (por ejemplo, ventas, facturación o población). Cada columna de tus datos crea una línea nueva en el gráfico.

Si estás comparando varias líneas, añade varias columnas.

Con múltiples columnas, los Bloques de gráfico de línea pueden entablar varias comparaciones entre los temas.

Otros consejos

  • No es posible añadir incertidumbres ni proyecciones (líneas grises o de puntos que anticipan las tendencias).
  • No se puede cambiar la posición del título, la leyenda y el epígrafe dentro del bloque.
  • Para cambiar el tamaño de los Bloques de gráfico de líneas, consulta Cambiar el tamaño de los bloques.
  • En tu sitio activo, los consejos de las herramientas aparecen cuando posicionas el cursor para mostrar los detalles del punto de datos.

Los Bloques de gráfico de torta han sido diseñados para comparar hasta cinco elementos. Cada paleta de colores incluye cinco colores antes de empezar a repetirlos.

Los datos solo deben contener dos columnas: la primera columna, que contiene un rótulo, y la segunda columna, que contiene el valor numérico que representa dicho rótulo. En el ejemplo que sigue, la primera columna incluye la lista de tortas y la segunda columna comprende la cantidad de personas a quienes les gusta esa torta.

La pestaña Datos de un Bloque de gráfico de torta.

Otros consejos

  • No recomendamos cambiar los ejes X e Y.
  • No se puede cambiar la posición del título, la leyenda y el epígrafe dentro del bloque.
  • Para cambiar el tamaño de los Bloques de gráfico de torta, consulta Cambiar el tamaño de los bloques.
  • En tu sitio activo, los consejos de las herramientas aparecen cuando posicionas el cursor para mostrar los detalles del punto de datos.

Diseña el gráfico

En la pestaña Diseño, puedes añadir texto personalizado, mostrar una leyenda y seleccionar una paleta de colores. Para informarte mejor sobre estas opciones de diseño, consulta este cuadro:

Opción del diseño Usa estas opciones con los siguientes fines
Título del gráfico Agrega un título al gráfico. Recomendamos que sea breve, como "Venta de entradas en 2019".

Leyenda

Añade una leyenda que aparecerá debajo del gráfico. Esta leyenda es útil para citar las fuentes, fechas, explicaciones detalladas o cláusulas de exención de responsabilidad.
Mostrar leyenda Mostrar los rótulos de los datos en una leyenda.

Paleta de colores

Selecciona una paleta de colores para el gráfico de una de nuestras numerosas opciones preconfiguradas, que te permitirán crear un aspecto uniforme. Cada opción tiene cinco colores. No es posible personalizar los colores específicos para los puntos de datos ni los ejes del gráfico en este momento.
Consejo: Cambia las fuentes y los colores del texto del gráfico en el panel Estilos del sitio con los ajustes de estilo EncabezadoTexto. Las opciones exactas varían según cada plantilla.

Exportar los datos del gráfico

Para hacer una copia de seguridad de tus datos en un archivo .csv fuera de Squarespace:

  1. En el Menú de Inicio, haz clic en Páginas.
  2. Presiona Editar en la página o en la publicación donde aparece el Bloque de gráfico.
  3. Haz clic en Editar, en el Bloque de gráfico.
  4. Haz clic en la pestaña Importar/Exportar.
  5. Copia los datos en la casilla Datos del gráfico.
  6. Paste the data into a plain text editor.
  7. Save the file as a .csv. This converts the file into a spreadsheet.
¿Fue útil este artículo?
Usuarios a los que les pareció útil: 9 de 29
Usar los Bloques de gráficos