Hi there, I have a similar issue to @wesleyboers but am struggling to make it work. My daily notes are formatted in the form "dddd, MMMM Do YYYY" ("Wednesday, November 16th 2022").

Here is the code I'm trying to adapt:

dv.span("Physics")
const calendarData = {
    year: 2022,  // (optional) defaults to current year
    colors: {    // (optional) defaults to green
        blue:        ["#8cb9ff", "#69a3ff", "#428bff", "#1872ff", "#0058e2"], // first entry is considered default if supplied
        green:       ["#c6e48b", "#7bc96f", "#49af5d", "#2e8840", "#196127"],
        red:         ["#ff9e82", "#ff7b55", "#ff4d1a", "#e73400", "#bd2a00"],
        orange:      ["#ffa244", "#fd7f00", "#dd6f00", "#bf6000", "#9b4e00"],
        pink:        ["#ff96cb", "#ff70b8", "#ff3a9d", "#ee0077", "#c30062"],
        orangeToRed: ["#ffdf04", "#ffbe04", "#ff9a03", "#ff6d02", "#ff2c01"]
    },
    showCurrentDayBorder: true, // (optional) defaults to true
    defaultEntryIntensity: 4,   // (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
    entries: [],                // (required) populated in the DataviewJS loop below
}

//DataviewJS loop
for(let page of dv.pages('"1. Daily notes/2022/11-November/"').where(p=>p.physics).sort(p=>p.file.name)){
    //dv.span("<br>" + page.file.name) // uncomment for troubleshooting

    const date = new Date(page.file.name);
    const yyyy = date.getFullYear();
    let mm = date.getMonth() + 1; // Months start at 0!
    let dd = date.getDate();
    if (dd < 10) dd = '0' + dd;
    if (mm < 10) mm = '0' + mm;
    const formattedDate = yyyy + "-" + mm + '-' + dd;

    calendarData.entries.push({
        date: formattedDate,     // (required) Format YYYY-MM-DD
        intensity: page.physics, // (required) the data you want to track, will map color intensities automatically
        content: "🏋️",           // (optional) Add text to the date cell
        color: "orange",          // (optional) Reference from *calendarData.colors*. If no color is supplied; colors[0] is used
    })
}

renderHeatmapCalendar(this.container, calendarData)

Is the problem that getMonth(), getDate() etc. aren't working in this case of date format?

Reposted from #2 (comment) as a new issue

Class "isEmpty" isn't getting added to the <li>s, so those cells have the same color regardless of light or dark mode. Text elements properly switch between modes, just not the empty cells. EDIT: no class names are getting pushed. "today" is missing as well.

After the latest update the showCurrentDayBorder property is not working correctly.
Even if it's set to true, the border is not rendered on the heatmap.

For shorter-term tracking and use in other tracking pages (like when used with periodic-notes), it would be nice to have only a single month displayed rather than needing to render the entire year. Columns are days of week, rows are week number (configurable?).

Could be done with changes to the configuration:

Month

const calendarData = { 
	type: month,
        date: 05, // month formated as "MM"
        rowfmt: "ww", // defaults to "WW"
        colfmt: "ddd",
	colors: {   // optional, defaults to first value
	  blue:        ["#b8d4ff","#6da6ff","#2c7dff","#0059e7","#003ea1"], // this first entry is considered default
	  green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	  red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	  orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	  pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	  orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"],
	},
	entries: [] // populated in the DataviewJS loop below
}

Year:

const calendarData = { 
	type: year,
        date: 2022, // year formated as "yyyy"
        rowfmt: "ddd", // defaults to "ddd"
        colfmt: "MMM", // defaults to "MMM"
	colors: {   // optional, defaults to first value
	  blue:        ["#b8d4ff","#6da6ff","#2c7dff","#0059e7","#003ea1"], // this first entry is considered default
	  green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	  red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	  orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	  pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	  orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"],
	  blueblack:   ["#00378f","#005ced","#3281ff","#6fa6ff","#a5c7ff"]
	},
	entries: [] // populated in the DataviewJS loop below
}

Hello,

Would it be possible to add a button to the heatmap preview that can change which year you are looking at?
I appreciate that it is possible to do so by writing a bit of dataview code, so this is not the highest priority, but it might be nice to have it as part of the rendered heatmap if possible.

I have been using the heatmap calendar for a while and have been quite happy with it. However, I recently reorganized all of my daily notes into a YYYY/MM/Day Planner-YYYYMMDD folder structure and now all of the heatmaps I had been using are empty.

I tried to change it to a tag in the meta YAML such that the meta is something like:

---
tags:
  - dayplaner
---

as well as adding a #dayplanner tag into the body of the notes but neither of those produce a graph either.

How can I tell the heatmap generator to search all subfolders as well for data?

Code I am using:

dv.span("Course Attendance")

const calendarData = {
    year: 2022, // optional, defaults to current year
	colors: {   // optional, defaults to green
	    blue:        ["#8cb9ff","#69a3ff","#428bff","#1872ff","#0058e2"], // this first entry is considered default
	    green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	    red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	    orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	    pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	    orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"]
	},
    entries: []
}

//for (let page of dv.pages('"Day Planners"').where(p=>p.course).sort(p=>p.file.name)) {
for (let page of dv.pages("#dayplanner").where(p=>p.course).sort(p=>p.file.name)) {
    calendarData.entries.push({
        date: page.file.day,
        intensity: 1
    })
}

renderHeatmapCalendar(this.container, calendarData)

I have installed baseview and heatmap-calender plugin, cloned the EXAMPLE_VAULT to my local, it cannot render the daily notes' log. Is there any issue with my Ob version?
Ob version: v0.14.6

Dear @Richardsl , I just started to use your plugin and it's amazing. But since I talk Portuguese, I'd like to see names of months and days of week in my language. It would be great if the plugin used the names in the current locale language or, at least, allowed the user to edit the names.

Thank you for the great work!

I'd like each month to be a slightly different "gray" color. Like striping in an excel data. For blocks with no info to report make odd months dark gray, and even months a slightly lighter dark gray, just so visibly it is a little easier to see at a glance.

I'm trying to troubleshoot why my heatmap isn't working so I whipped up this example. Nothing shows when this is rendered:

dv.span("Sleep Heatmap")

const calendarData = {
    intensityScaleStart: 1,   
    intensityScaleEnd: 12,
    year: 2023,  
    entries: [], 
}

calendarData.entries.push = ({
        date: "2023-01-13",
        intensity: 5,
})

renderHeatmapCalendar(this.container, calendarData)

I'm trying to setup a heatmap in my vault and I was testing using the file names (example: "2023-01-11") and including the date as a field within a note, but the cells are not appearing for some reason and I can't figure out why. Dataview appears to be working properly as it's retrieving the data from the notes without any problem, it just doesn't appear on the heatmap itself. I'm not seeing any errors in the web console either.

I can't figure out if I'm doing something wrong or it's broken. For what it's worth another plugin I use is having problems as well, so maybe an update broke things.
I tried the example vault and the heatmaps there still work.
Linux Appimage, Obsidian 1.1.9, Heatmap Calendar 0.5.3

As a user, I would like to be able to have more control over colors that are being added in the Heatmap settings page. That way, I don't have to look somewhere else to create a color array and can edit my pre-existing colormaps if I want to change a color.

Some features that would be nice include the following:

Edit Button

An edit button to bring up the previous colormap would allow easy editing similar to adding new colormaps.

Color Picker UI

Adding a color picker UI would allow easy insertion instead of forcing a specific color array format.

Currently the readme has:

colors: {   // optional, defaults to green
  blue:        ["#8cb9ff","#69a3ff","#428bff","#1872ff","#0058e2"], // this first entry is considered default
//...
},

But these values aren't optional. If you take colors object out you get a render error.

Intensity is also not optional. This also throws a render error if its missing. With the values 1-5 not actually changing anything.

Might be missing something obvious here, but my note dated for Jan 1 2023 shows up in 2022 and not in 2023:

note in question:

2022 calendar:

2023 calendar:

Does anyone know why I am getting this result with the new Hover Preview?

CODE:

dv.span("**💀🧙‍♂️🧙‍♀️ D&D Session 🧙‍♀️🧙‍♂️💀**")

const calendarData = {
    colors: {
        blue: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"]
    },
    entries: [],
    showCurrentDayBorder: false
}

for(let page of dv.pages('"0. Session Journals/Deadly Depth Inn"').where(p=>p.players)){
    calendarData.entries.push({
        date: page.sessionDate, // (required) Format YYYY-MM-DD
        intensity: page.players,
        content: await dv.span(`[](${page.file.name})`), //for hover preview
    })  
}

renderHeatmapCalendar(this.container, calendarData)

RESULT:
Each box is displaying the title of the Note instead of nothing and the mouse over does not work.

NOTE FRONT MATTER

---
sessionDate: 2022-02-06
players: 6
type: Session Journal
---

When following the author's instructions, color doesn't even seem to use the default green, rather it is white, no matter what value is given.

I've been having issues getting the heatmap plugin to work. My daily notes are in the date format: YYYY-MM-DD so I'm confused as to why it's not working

Nothing shows. I use a Windows 10 computer.

It'd be helpful to see at a glance what day it is today by graying out all squares for dates that are in the future. Here's an example from the anki heatmap plugin.

Expected Behavior

The color is set to the maximal intensity when all intensities are the same.

Current Behavior

No color is set.

Hello,

I just updated heatmap to 0.5.3, and now all my heatmaps seem to be broken.
This is how they currently look:

Before the update only a few of the days in the heatmap would be white, and everything behaved as expected.

this is the code Im using for the heatmap

var page_selection = dv.pages("#event")
                        .where(x=> dv.array(x[searchfield]).indexOf(searchterm) > -1 )
                        .sort(k => k["day"], 'desc')

// for rendering heatmap

const calendarData = {
    colors: {
        white: ["#fff","#fff","#fff","#fff","#fff"],
    },
    entries: []
}


// render the heatmap 
for(let page of page_selection){
    calendarData.entries.push({
        date:  page.file.day,
        content: await dv.span(`[[${page.file.name}| ]]`)
    }) 
}

console.log(calendarData)
	
renderHeatmapCalendar(this.container, calendarData)

where searchfield and searchterm are variables that correspond to key-value pairs of the frontmatter of the note

Hi

I am thinking on a layout with a pane for notes and a pinned pane with the Heatmap. When a note is selected in the tree, it would be very useful that the pane with the Heatmap scrolled down (in case the related heatmap is out of the visible area) to show the selected note (if possible, highlighted).

That would allow to fast locate in context (time/calendar) together with the other notes. For some applications where the calendar time is important (because of context) it is very interesting.

Thanks!

As a user, I want to limit the heatmap calendar to a specific time segment (i.e. one month or one week) so that my space is less cluttered and my notes are more focused on a specific period of time.

Hello! I am having a lot of trouble getting this plugin to work with nested key/value pairs in my yaml front matter. I tried copying the "social" heatmap calendar example that was provided, but to no avail. ChatGPT couldn't help me either.

This is what my front matter looks like:

---
food:
	smoothie: true
	water-cups: 5
movement:
	rebounding: true
	running: true
---

(I pressed tab to nest key/values, if that matters. )

Here is what my query looks like:

dv.span("smoothie")
const calendarData = {
    year: 2023,
    colors: {
        orange:      ["#ff7800"],
    },
    showCurrentDayBorder: true,
    defaultEntryIntensity: 1,
    entries: [],
}

for (let page of dv.pages('"10 daily notes/2023"').where(p => p.food)) {
    
    calendarData.entries.push({
        date: page.file.name,
        intensity: page.food.smoothie,
        content: "",       
    })
}

renderHeatmapCalendar(this.container, calendarData)

I have tried changing the where(p=> p.food) to where(p=>p.food.smoothie) but then I get an error message. This code block works perfectly well when the key/value pairs aren't nested.

Calendar continues to show 2022 days. Do I need to do something to switch to 2023?

Able to set a value (optional) in code block that specifies a color for cells that have no value:

const calendarData = { 
	year: 2022 , 
        background: "#FFFFFF", //optional, defaults to "#000000"
	colors: {   // optional, defaults to first value
	  blue:        ["#b8d4ff","#6da6ff","#2c7dff","#0059e7","#003ea1"], // this first entry is considered default
	  green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	  red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	  orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	  pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	  orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"],
	},
	entries: [] // populated in the DataviewJS loop below
}

Hi!
I just installed your plugin because it looks really neat and promising. However, as i copy&paste the example from the Readme i get the following error message:

Evaluation Error: ReferenceError: renderHeatmapCalendar is not defined
    at eval (eval at <anonymous> (plugin:dataview), <anonymous>:13:1)
    at DataviewInlineApi.eval (plugin:dataview:19673:16)
    at evalInContext (plugin:dataview:19674:7)
    at asyncEvalInContext (plugin:dataview:19684:32)
    at DataviewJSRenderer.render (plugin:dataview:19705:19)
    at DataviewRefreshableRenderer.maybeRefresh (plugin:dataview:19283:22)
    at t.e.tryTrigger (app://obsidian.md/app.js:1:1027924)
    at t.e.trigger (app://obsidian.md/app.js:1:1027857)
    at t.trigger (app://obsidian.md/app.js:1:1648741)
    at DataviewPlugin.eval (plugin:dataview:20688:76)

I'm using:

• Obsidian v1.0.3
• Dataview v0.5.47
• HeatmapCalendar v0.5.2

I restarted the application multiple times, but the error persists.

Thanks in advance for looking into this ✌️

Hi - Could you please add a separate dark mode version for the .heatmap-calendar-boxes .today CSS rule? I think it would help a lot with the visibility of the marker.

I think adding something like this

.theme-dark .heatmap-calendar-boxes .today {
  border: 1px solid rgb(180, 180, 180);
}

would do the trick.

Hey!

I noticed that the hover preview is not working for me. I tried replicating the examples provided in the example vault in my own vault, but for none of them the hover preview is working.

Are you aware of anything that could be preventing the hover preview from working properly?

Thanks!

Hi Richard and many thanks for your plugin.

I think it could be a really cool feature to add the possibility to display numeric data using a line chart.
The difference is that the numeric values will determine the line trajectory instead of the box color intensity.

sorry if I am a bit obsessed with this plugin, I got a new "issue"
Having a heatmap for every habit on the daily page is too much. I just want one that shows how many I did that day.
Because I will add in the future more habits or take some away a literal score like 5 for 5 habits done and then 8 for 8 habits done would be unfair. Because if I would stop to track 5 habits because I dont want to use them I cant achieve anymore as many points as I did earlier. So the intensity would be unfair.
The easiest solution is using fractions.
So if I track 12 habits and completed 10 I would just type habits::10/12
and if I would add habits, I would type habits::11/13
Fractions could show it like percents but better and simpler
Using fractions as numerical value doesn't work yet. I can ofc calculate them to numerical so 10/12 = 83.333% but always converting that will be pain. Is there any way to implement that or is this limited because of using the dataview?

Sorry I feel like I should be able to figure this out but apparently I really suck at this dataviewjs stuff.
I'm just trying to point the dataviewjs to a different folder and nothing seems to be working.
Can you help point a noob in the right direction?

It would be nice to be able to jump to a specific note when hovering over a square

Is there any way to open note when click item in heatmap ?

Choosing 2022 as the year for a calendar is showing the wrong calendar. It looks like Jan 1, 2022 starts on a Friday when it should be starting on a Saturday:

Rendered:

Markdown:

### `ris:Zzz` Sleep `ris:Zzz`
```dataviewjs
const calendarData = { 
	year: 2022 , 
	colors: {   // optional, defaults to first value
	  blue:        ["#8cb9ff","#69a3ff","#428bff","#1872ff","#0058e2"], // this first entry is considered default
	  green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	  red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	  orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	  pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	  orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"]
	},
	entries: [] // populated in the DataviewJS loop below
}

for(let page of dv.pages('"periodic-notes/daily"').where(p=>p.tracking.sleep).sort(p=>p.date)){ //DataviewJS stuff

	calendarData.entries.push({
		date: moment(page.file.name, 'YYYY.MM.DD - ddd').format('YYYY-MM-DD'),
		intensity: moment.duration(page.tracking.sleep, 'hours').asHours(), // optional, what color intensity to use for entry, will autoscale. Default 4 (1-5)
		content: moment(page.file.name, 'YYYY.MM.DD - ddd').format('DD'),
		color: "blue", // optional, reference from your colors object. If no color is supplied; colors[0] is used
	})

}

/**
* param1  HTMLElement   this gives the plugin a reference to render the calendar at
* param2  CalendarData  your calendar object, with settings/data for the calendar
*/
renderHeatmapCalendar(this.container, calendarData)

``` 

Obsidian: v0.13.33
OS: Windows 10
Heatmap Calendar: v0.1.0

Appearance:

My Code:

const calendarData = { 
   year: 2022,  // (optional) Defaults to current year
   colors: {    // (optional) Defaults to green
     blue:        ["#8cb9ff","#69a3ff","#428bff","#1872ff","#0058e2"], // first entry is considered default if supplied
     green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
     red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
     orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
     pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
     orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"]
   },
   showCurrentDayBorder: true, // (optional) Defaults to true
   defaultEntryIntensity: 4, // (optional) Defaults to 4
   intensityScaleStart: 10, // (optional) Defaults to lowest value passe to entries.intensity
   intensityScaleEnd: 100, // (optional) Defaults to highest value passe to entries.intensity
   entries: [], // Populated in the DataviewJS loop below
}

//DataviewJS loop
for(let page of dv.pages('#morningEntry').where(p=> p["Wake Early"] === "🟩" || p["Wake Early"]==="🟨")){ 

   console.log(page.file.name)

   const extractedDateFromFile = page.file.name.split(" ")[0]
   calendarData.entries.push({
   	date: extractedDateFromFile, // (required) Format YYYY-MM-DD
   	intensity: 100, // (required) the data you want to track, will map color intensities automatically
   	content: "", // (optional) Add text to the date cell
   	color: "orange", // (optional) Reference from *calendarData.colors*. If no color is supplied; colors[0] is used
   })

}
console.log(calendarData)
/**
* param1  HTMLElement   DOM reference for calendar rendering
* param2  CalendarData  Calendar data object from above
*/
renderHeatmapCalendar(this.container, calendarData)

I like the way you have redsigned to use Yaml or adjusting intensity using dataviewjs.

Is there a way to create a heatmap of the total number of files created or modified (user's choice).

This does it for a month:

	Calendar file.ctime 

but it would be nice to have it match the rest of the heatmaps and use the number of files created as the intensity.

Hi there! It seems like one of the updates in the main.js caused my heatmap to stop displaying.

Here it is working with main.js from 0.2:

and here is when I update main.js to what is on 0.3

I'd love to get your insight into what might be causing this. The issue persists on light mode theme as well so presumably it's not the styling

Sort of like tasks. More of a feature request.

Hi! On my daily notes I have a frontmatter property like vacation: "true"

I would like the heatmap to just show a color if the day has vacation: "true"

My daily notes are located as such:

Note Vault
→ Journal
→→ Daily
→→→ 2023-01
→→→→ 2023-01-01
→→→ 2023-02
→→→→ 2023-02-01

Thanks!

I don't know if you heard about the projects plugin. But it wants to integrate other plugins as views. You can check this article to get an overview of the plugin.

I would like to suggest adding this plugin as a view to the projects plugin, you can check the related issue or the custom view API for context, or you can reach out to the maintainer on discord (marcusolsson#5186), he said he'd be happy to help you in the process.

Thank you so much for this work. I love using your heatmaps. One question I had is there a way to ADD up multiple entries. For example, if you are doing something more than once a day (like eating or even writing). I keep a sepreate daily log file by time for each day. I added a Nutrution heatmap (see below) but I want to add all entrest on one day together. Thank you for your help.

dv.span("** Nutrition **")

const calendarData = { 
	entries: [], // Populated in the DataviewJS loop below
	year: 2022,  // (optional) Defaults to current year
	colors: {    // (optional) Defaults to green
	  blue:        ["#8cb9ff","#69a3ff","#428bff","#1872ff","#0058e2"], // first entry is considered default if supplied
	  green:       ["#c6e48b","#7bc96f","#49af5d","#2e8840","#196127"],
	  red:         ["#ff9e82","#ff7b55","#ff4d1a","#e73400","#bd2a00"],
	  orange:      ["#ffa244","#fd7f00","#dd6f00","#bf6000","#9b4e00"],
	  pink:        ["#ff96cb","#ff70b8","#ff3a9d","#ee0077","#c30062"],
	  orangeToRed: ["#ffdf04","#ffbe04","#ff9a03","#ff6d02","#ff2c01"],
	  blackgreenred: ["#efffeb","#c5e59f","#86f202","#fd7777","#ff0000"]

	},
	showCurrentDayBorder: true // (optional) Defaults to true
}

//DataviewJS loop
for(let page of dv.pages('"Daily-Document"').where(p=>p.Nutrition).sort(p=>p.file.name)){ 

	calendarData.entries.push({
		date: page.file.name, // (required) Format YYYY-MM-DD
		intensity: page.Nutrition, // (required) Color intensity for entry, will map intensities automatically
		content: "", // (optional) Add text to the date cell
		color: "blackgreenred", // (optional) Reference from *calendarData.colors*. If no color is supplied; colors[0] is used
	})

}

/**
* param1  HTMLElement   DOM reference for calendar rendering
* param2  CalendarData  Calendar data object from above
*/
renderHeatmapCalendar(this.container, calendarData)

Hi! I download the EXAMPLE_VAULT code. And I didn't change anything.But Cells are not showing,I cant find any bug.

Here is the part of my script where I setup the hover preview:

...
data.entries.push(
    {
        date: page.started,
        intensity: 1,
        content: await dv.span(`[](${page.file.name})`) // not working as expected
    }
)
...

Here is the result with a file named Europe:

Here is the result with a file named Europe Test:

Splitting the file name by a space character solves the rendering issue, but, naturally, prevents the Heatmap from displaying the file contents.

await dv.span(`[](${page.file.name.split(" ")["0"]})`)

Hi,

I have found a limitation that for my use, is a break dealer: to show in each day several notes, I know it works, but for the hover preview it does not. A kind of popup with the a list of the notes for that day could work, so to allow the user to choose one, or something similar would solve my problem.

I am referring to cases as for example, during holidays, visits I liked, we can have several visits on the same day with the same or different level of interest, but all of them the same day. It is not practical to make several yearly heatmaps just for all the visits.

Is there a way to do that currently?

Thanks

My YAML keys have two values;

---
workout: 30 minutes, 4
study: 1 hour 45 minutes, 8
...
---

for example, to signify my "rating" for an activity along with its duration.

I would like to map my intensity values according to the product of these values in the key, i.e., for this example, the number 0.5 x 4 = 2 for the workout key, and the number 1.75 x 8 = 14 for the 'study' key.

I know this is probably quite a simple operation but I don't know any Dataview and struggled with this. Any advice?

My suggestion is to add a Settings option, as follows:

const calendarData = {
    year: 2023,  // (optional) defaults to current year
    quarter: 1,  // (optional)
    month: 2,   // (optional)
    week: 1      // (optional) absolute week number to year or relatvie week number to current month

I have developed a new style based on this plugin. Can I incorporate it or release it as another plugin?

Heatmaps doesnt show colors in my created vault.
I downloaded the Example Vault and it shows Colors - I copied the correct "dataviewjs" code from the example vault to mine and fixed the folder location to mine. The Heatmap is finding the Note but isnt coloring the box.

It would be amazing if it could show below the heatmap some data about that.
Options could be:
Current Streak, Longest Streak, Accuracy (acc since jan1 or acc since first entry ever), average amount (probably only possible with numbers and not with words or true and false)

As design inspirate I would submit the design from the anki heatmap addon.
Just the clean heatmap and at the bottom the stat and the a amount left to it.

Coding implementation for the dataview could look like:
Current_Streak: True
Longest_Streak: False
Accurace: Beginning

or anything else