mirror of
https://github.com/zadam/trilium.git
synced 2025-11-11 15:55:52 +01:00
feat(docs): improve documentation for code notes, code blocks
This commit is contained in:
@@ -1,21 +1,21 @@
|
||||
# Weight Tracker
|
||||

|
||||
|
||||
The `Weight Tracker` is a [Script API](../Code%20Notes/Script%20API.md) showcase present in the [demo notes](../Database.md).
|
||||
The `Weight Tracker` is a [Script API](../../Note%20Types/Code/Script%20API.md) showcase present in the [demo notes](../Database.md).
|
||||
|
||||
By adding `weight` as a [promoted attribute](../Attributes/Promoted%20Attributes.md) in the [template](../Attributes/Template.md) from which [day notes](Day%20Notes.md) are created, you can aggregate the data and plot weight change over time.
|
||||
|
||||
## Implementation
|
||||
|
||||
The `Weight Tracker` note in the screenshot above is of the type `Render Note`. That type of note doesn't have any useful content itself. Instead it is a placeholder where a [script](../Code%20Notes/Scripts.md) can render its output.
|
||||
The `Weight Tracker` note in the screenshot above is of the type `Render Note`. That type of note doesn't have any useful content itself. Instead it is a placeholder where a [script](../../Note%20Types/Code/Scripts.md) can render its output.
|
||||
|
||||
Scripts for `Render Notes` are defined in a [relation](../Attributes.md) called `~renderNote`. In this example, it's the `Weight Tracker`'s child `Implementation`. The Implementation consists of two [code notes](../Code%20Notes.md) that contain some HTML and JavaScript respectively, which load all the notes with a `weight` attribute and display their values in a chart.
|
||||
Scripts for `Render Notes` are defined in a [relation](../Attributes.md) called `~renderNote`. In this example, it's the `Weight Tracker`'s child `Implementation`. The Implementation consists of two [code notes](../../Note%20Types/Code.md) that contain some HTML and JavaScript respectively, which load all the notes with a `weight` attribute and display their values in a chart.
|
||||
|
||||
To actually render the chart, we're using a third party library called [chart.js](https://www.chartjs.org/)which is imported as an attachment, since it's not built into Trilium.
|
||||
|
||||
### Code
|
||||
|
||||
Here's the content of the script which is placed in a [code note](../Code%20Notes.md) of type `JS Frontend`:
|
||||
Here's the content of the script which is placed in a [code note](../../Note%20Types/Code.md) of type `JS Frontend`:
|
||||
|
||||
```
|
||||
async function getChartData() {
|
||||
|
||||
Reference in New Issue
Block a user