Charts para Swift: guía completa con ejemplos

Entrenador de Python en Línea para Principiantes

Aprende Python fácilmente sin sobrecargarte de teoría. Resuelve tareas prácticas con verificación automática, recibe pistas y escribe código directamente en el navegador, sin instalar nada.

Start Course

Introducción a Charts para Swift

\n\n

Charts es una potente y flexible biblioteca de código abierto para la visualización de datos en plataformas Apple (iOS, tvOS, macOS, watchOS). Está escrita en Swift y ofrece una amplia gama de tipos de gráficos: desde simples gráficos lineales y de barras hasta complejos gráficos combinados y de burbujas. La biblioteca es un fork de la famosa biblioteca de iOS ios-charts, que a su vez fue portada de la biblioteca Java MPAndroidChart.

\n\n

¿Para qué sirve Charts?

\n
    \n
  • Visualización de datos: Convierte números aburridos en gráficos y diagramas visuales.
  • \n
  • Rica funcionalidad: Soporta animación, interacción táctil (toques, selección), leyendas, ejes, marcadores de datos y mucho más.
  • \n
  • Rendimiento nativo: Escrita en Swift, utiliza Core Graphics y Core Animation, lo que garantiza un funcionamiento fluido incluso con grandes conjuntos de datos.
  • \n
  • Facilidad de integración: Se instala fácilmente a través de Swift Package Manager, CocoaPods o Carthage.
  • \n
  • Comunidad activa: Se actualiza regularmente, cuenta con documentación extensa y numerosos ejemplos.
  • \n
\n\n

Instalación de la biblioteca Charts

\n\n

Charts se puede instalar de una de las tres formas principales. La recomendada es Swift Package Manager (SPM).

\n\n

1. Swift Package Manager (SPM) — Método recomendado

\n
    \n
  1. En Xcode, abre tu proyecto.
  2. \n
  3. Selecciona File → Add Packages...
  4. \n
  5. En el campo de búsqueda, ingresa la URL del repositorio: https://github.com/danielgindi/Charts.git
  6. \n
  7. Selecciona la versión deseada (generalmente la última estable).
  8. \n
  9. Haz clic en Add Package.
  10. \n
  11. Asegúrate de que el paquete se haya agregado a tu target.
  12. \n
\n\n

2. CocoaPods

\n

Agrega a tu Podfile:

\n
platform :ios, '13.0'\nuse_frameworks!\n\ntarget 'YourApp' do\n  pod 'Charts'\nend
\n

Luego ejecuta el comando en la terminal:

\n
pod install
\n\n

3. Carthage

\n

Agrega a tu Cartfile:

\n
github "danielgindi/Charts"
\n

Luego ejecuta:

\n
carthage update
\n\n

Inicio rápido: Creando tu primer gráfico

\n\n

Vamos a crear un gráfico lineal simple que muestre el cambio de temperatura durante una semana.

\n\n
    \n
  1. Importa la biblioteca en tu controlador:\n
    import UIKit\nimport Charts
    \n
  2. \n
  3. Agrega una View en Storyboard o créala programáticamente:\n

    En el storyboard, arrastra un UIView y cambia su clase a LineChartView en el Inspector de Identidad (Identity Inspector). Crea un IBOutlet:

    \n
    @IBOutlet weak var lineChartView: LineChartView!
    \n
  4. \n
  5. Configura los datos:\n
    func setupLineChart() {\n    // 1. Crear puntos de datos\n    let dataEntries: [ChartDataEntry] = [\n        ChartDataEntry(x: 1.0, y: 20.0),\n        ChartDataEntry(x: 2.0, y: 22.0),\n        ChartDataEntry(x: 3.0, y: 19.0),\n        ChartDataEntry(x: 4.0, y: 25.0),\n        ChartDataEntry(x: 5.0, y: 23.0),\n        ChartDataEntry(x: 6.0, y: 21.0),\n        ChartDataEntry(x: 7.0, y: 26.0)\n    ]\n\n    // 2. Crear el conjunto de datos\n    let lineDataSet = LineChartDataSet(entries: dataEntries, label: "Temperatura (°C)")\n    lineDataSet.colors = [.systemBlue] // Color de la línea\n    lineDataSet.circleColors = [.systemRed] // Color de los puntos\n    lineDataSet.circleRadius = 4.0\n    lineDataSet.lineWidth = 2.0\n\n    // 3. Crear el objeto de datos\n    let lineData = LineChartData(dataSet: lineDataSet)\n\n    // 4. Asignar los datos al gráfico\n    lineChartView.data = lineData\n\n    // 5. Configuraciones adicionales\                    

Recommendations