Muestra las diferencias entre dos versiones de la página.
Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
contrib:wchart [11/04/2022 09:43] pedro |
contrib:wchart [08/11/2023 15:39] (actual) pedro [Métodos] |
||
---|---|---|---|
Línea 1: | Línea 1: | ||
======🚧 wChart 🚧====== | ======🚧 wChart 🚧====== | ||
- | Esta clase Néfeliza el control [[https://www.chartjs.org/docs/2.9.4/|Chart.js]], ha sido realizada como una contribución a Néfele. | + | Esta clase Néfeliza el control [[https://www.chartjs.org/docs/2.9.4/|Chart.js]], permitiendo incluir en nuestras web gráficos para la representación de datos de una manera sencilla y muy vistosa. |
+ | |||
+ | Tenemos Néfelizadas 3 versiones de la librería [[https://www.chartjs.org/docs/2.9.4/|Chart.js]] con tres clases distintas. | ||
+ | |||
+ | **wChart** corresponde con la versión [[https://www.chartjs.org/docs/2.9.4/|2.9.4]] | ||
+ | |||
+ | **wChart_351** corresponde con la versión [[https://www.chartjs.org/docs/2.9.4/|3.5.1]] | ||
+ | |||
+ | y **wChart_382** corresponde con la versión [[https://www.chartjs.org/docs/2.9.4/|3.8.2]] | ||
+ | |||
+ | Ha sido realizada como una [[contrib:wchart#Agradecimientos|contribución]] a Néfele. | ||
===== Ejemplo de uso ===== | ===== Ejemplo de uso ===== | ||
- | {{url>https://samples.nefele.dev/wiki/wchart 100%, 350px}} | + | {{url>https://samples.nefele.dev/wiki/wchart 100%, 250px}} |
<Code:xailer linenums:1> | <Code:xailer linenums:1> | ||
/* Este ejemplo corresponde al que puede encontrar en la página inicial de Chart.js */ | /* Este ejemplo corresponde al que puede encontrar en la página inicial de Chart.js */ | ||
- | WITH OBJECT WChart():New(:WO) | + | WITH OBJECT WChart_382():New(:WO) |
:cHeight := 300 | :cHeight := 300 | ||
:cWidth := 500 | :cWidth := 500 | ||
Línea 34: | Línea 44: | ||
END WITH | END WITH | ||
WITH OBJECT :options | WITH OBJECT :options | ||
- | :responsive := .F. /* Por defecto lo tenemos a .T. */ | + | :responsive := .F. // Por defecto lo tenemos a .T. |
+ | |||
+ | // Podemos asignar una propiedad directamente | ||
+ | :scales:yAxe():ticks:beginAtZero := .F. // El gráfico no empieza en 0, por defecto es .T. | ||
+ | |||
+ | /* También podemos ir accediendo a la estructura del objeto hasta llegar a la propiedad | ||
WITH OBJECT :scales | WITH OBJECT :scales | ||
WITH OBJECT :yAxe() | WITH OBJECT :yAxe() | ||
WITH OBJECT :ticks | WITH OBJECT :ticks | ||
- | :beginAtZero := .F. /* El gráfico no empieza en 0 */ | + | :beginAtZero := .F. // El gráfico no empieza en 0, por defecto es .T. |
END WITH | END WITH | ||
END WITH | END WITH | ||
END WITH | END WITH | ||
+ | */ | ||
+ | |||
END WITH | END WITH | ||
END WITH | END WITH | ||
Línea 60: | Línea 77: | ||
|Configure | Este método nos devuelve el objeto Chart que corresponde con el gráfico a presentar, las propiedades de este objeto están documentadas en la ayuda de [[https://www.chartjs.org/docs/2.9.4/|Chart.js]] | 0.3| | |Configure | Este método nos devuelve el objeto Chart que corresponde con el gráfico a presentar, las propiedades de este objeto están documentadas en la ayuda de [[https://www.chartjs.org/docs/2.9.4/|Chart.js]] | 0.3| | ||
+ | ===== Agradecimientos ===== | ||
+ | |||
+ | A Joaquim Ferrer Godoy <quim_ferrer@yahoo.es> por contribuir con este fantástico control a Néfele. | ||