Closed sundevista closed 2 years ago
@ka1tzyu, here is simple solution:
calendarData.entries.push({
date: page.file.name,
intensity: intensity,
content: await dv.span(`[](${page.file.name})`)
})
and custom css to expand clickable area on entire a square:
.heatmap-calendar-boxes li {
position: relative;
}
.heatmap-calendar-boxes li:not(.task-list-item)::before {
content: unset;
}
.heatmap-calendar-boxes .internal-link {
text-decoration: none;
position: absolute;
width: 100%;
height: 100%;
}
Hi, when I add
content: await dv.span(`[](${page.file.name})`)
I see this and the cells are not clickable.
I've ensured Preview core plugin is enabled and I added that custom css to Obsidian's css snippet section (not sure if that's where it's supposed to go).
Here is my Dataview snippet
let metric = "caffeine"
dv.span(metric)
const calendarData = { entries: [], }
for (let page of dv.pages('"Daily"').where(p => p[metric])) {
// dv.span("<br>" + page.file.name) // uncomment for troubleshooting
// Title is required to be YYYY-MM-DD
// Converting to ll (Mon dd, YYYY)
let date = moment(page.file.name, "ll");
let formattedDate = date.format('YYYY-MM-DD');
calendarData.entries.push({
date : formattedDate, // (required) Format YYYY-MM-DD
intensity: page[metric], // (required) the data you want to track, auto-maps colors
content : await dv.span(`[](${page.file.name})`), //for hover preview
color : "obsidian",
})
}
renderHeatmapCalendar(this.container, calendarData)
front-matter
---
alias:
tags: daily
outlook: neutral
exercise:
- tricep-push-down
- squat
- seated-row
- pull-ups
- seated-leg-press
- deltoid-circles
calories: 0
caffeine: 200
alcohol: 0
weight: 162.5
thc: 0
---
If I remove that line then it looks like a proper calendar. New to JS and obsidian so would appreciate a hand!
Hi @Woodams,
The problem I just stumbled across the same problem. It is caused by how your settings define the link formatting. The one in the example is a classic markdown link, while you probably have the wikilinks format enabled in the Obsidian settings.
[display text](name-of-file)
[[name-of-file|display test]]
The solution Swap this line:
content : await dv.span(`[](${page.file.name})`), //for hover preview
With this one:
content: await dv.span(`[[${page.file.name}|]]`), //for hover preview
It would be nice to be able to jump to a specific note when hovering over a square