Richardsl / heatmap-calendar-obsidian

An Obsidian plugin for displaying data in a calendar similar to the github activity calendar
Apache License 2.0
614 stars 102 forks source link

How to show just a specific month? #90

Open adshz opened 1 year ago

adshz commented 1 year ago

Hi there,

I was thinking about if there was a way to just show a specific month rather than a whole year, regarding the use case of tracking habits monthly.

My attempt was below


dv.span("**👟 Gym ** First Phase")

const calendarData = {
 year: 2023,   
    month: 8,
    colors: {
        white: ["#ba3030", "#c72c2c", "#ce2525", "#d62121", "#df1b1b"],
    },
    entries: []
}

for(let page of dv.pages('"--Daily Briefing--"').where(p=>p.gym)){

    calendarData.entries.push({
        date: page.file.name,
        intensity: 4,
        content: "👟"
    })   
}

//console.log(calendarData)

renderHeatmapCalendar(this.container, calendarData)

I added a key month with the value 8 or August but I knew it didn't work after reviewing the code in main.ts ; If I wanted to develop this feature, what's the best way to do that? can you guide me a bit so I can learn and develop the specific feature for this plug in?

Best, David

tatablack commented 11 months ago

Maybe you've found out by yourself, but you could simply change the filter so that the heatmap is based on pages where gym is present and the month is August.

Since you're using page.file.name as the date, I'm assuming that your filenames are dates, which means every page object will have the day field available (see the docs). That field is a Luxon DateTime object.

Change where(p=>p.gym) into where(p=>p.gym && p.file.day.month == 8) and you should get what you want.

SunnyAureliusRichard commented 8 months ago

@tatablack that is still going to render the entire year

SunnyAureliusRichard commented 8 months ago

Closing as duplicate of https://github.com/Richardsl/heatmap-calendar-obsidian/issues/7