Heatmap calendar example

heatmap.md

const propertyName = "abs";
const emoji = "💪"; // ⏹️💤⚡⚠🧩↑↓⏳📔💾📁📝🔄📝🔀⌨️🕸️📅🔍✨💪
const color = ""; // See Heatmap plugin configuration for color names. If empty string: green

dv.span("** "+emoji+" Abs "+emoji+" **"); /* optional  */

const currentYear = DateTime.now().year;

const pages = dv.pages('"40 Journal/41 Daily Notes"').filter(p => p.file.name.startsWith(currentYear)).where(p => p[propertyName]).sort(p => p.file.name);
//console.log("Found pages: ", pages.length); // uncomment for troubleshooting

const maxIntensity = Math.max(...pages.map(p => p[propertyName ]));
//console.log("Max intensity: ", maxIntensity); // uncomment for troubleshooting

const calendarData = {
  year: currentYear,
  entries: [],
  //colors: {    // (optional) defaults to green
  //  yellowToRed: ["#ffdf04", "#ffbe04", "#ff9a03", "#ff6d02", "#ff2c01"]
  //},
  //showCurrentDayBorder: true, // (optional) defaults to true
  defaultEntryIntensity: 0,   // (optional) defaults to 4
  //intensityScaleStart: 10,    // (optional) defaults to lowest value passed to entries.intensity
  //intensityScaleEnd: 100,     // (optional) defaults to highest value passed to entries.intensity
  intensityScaleEnd: maxIntensity,
};

for(const page of pages) {
  //dv.span("<br>" + page.file.name); // uncomment for troubleshooting
  calendarData.entries.push({
    date: page.file.name,     // (required) Format YYYY-MM-DD
    intensity: page[propertyName], // (required) the data you want to track, will map color intensities automatically
    //content: await dv.span(`[[${page.file.name}|]]`), // Link to note
    //content: emoji,            // (optional) Add text to the date cell
    color, // (optional) If not set, and calendarData.colors is defined, the first one is used.
                   // If calendarData.colors is not defined, then the built-in green is used
  });
}

//console.log(calendarData); // uncomment for troubleshooting

renderHeatmapCalendar(this.container, calendarData);