Heatmap broken with newest update

[ben1mit]

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

[florida]

also broke for me. The items are displaying above instead of the heatmap.

[florida]

@ben1mit I was able to "fix" it temporarily by downgrading to 0.5.3 for now.

[raslab]

The same here. Looks like if you have few entities on a one date - heatmap pushes all 2+ entities to the top of container.

[raslab]

@ben1mit your case reproduces when using link with empty text. If you feel something to label links (e.g. dv.span("[[${page.file.name}|PLACE SOMETHING HERE]]"))- they will start to show.

@florida and your case reproducing in case of pushing date type to date field instead of string type. Mean something like this:

calendarData.entries.push({
    date:  dv.date(page.file.day),
    content: await dv.span(`[[${page.file.name}| ]]`)
}) 

Anyway, in my case it starts to push every second and above links to the top of the container...

I tested all 3 cases on versions 0.5.3, 0.5.2 - didn't help. Anyone know how to handle this issue?

In case if it will be helpful, my code:

let dateFormat = /\d{4}-\d{2}-\d{2}/
var pages = dv.pages("#LanguageLab/Marketing/AdsBuying").map(p=>p.file)
            .where(f=>f.frontmatter.date != null);

const maxCost = Math.max(...pages.map(p=>p.frontmatter.costUAH))
const calendarData = {
    colors: {
        green: ["#c6e48b", "#7bc96f", "#49af5d", "#2e8840", "#196127"]
    },
    intensityScaleEnd: maxCost,  
    entries: [],
}

for (let page of pages) {
    calendarData.entries.push({
        date: dateFormat.exec(page.frontmatter.date),
        intensity: page.frontmatter.costUAH,
        content: await dv.span(`[[${page.name}|💸]]`)
    })
}

renderHeatmapCalendar(this.container, calendarData)