CODEWITHSUNDEEP
angularherokutypescriptangular-clical-heatmap
UrbanCondor
UrbanCondor

Reputation: 83

cal-heatmap works locally, however errors after heroku deployment

I have an instance of cal-heatmap running fine on my Angular 2 (angular-cli) project locally. When I deploy the project to heroku it builds successfully, however I get the following errors in the console and my cal-heatmap doesn't show:

enter image description here

I'm not sure how to fix this as I don't think I should be editing the cal-heatmap.js file. The line in the file the first error is referring to is as follows:

getDayOfYear: d3.time.format("%j"),

I've made sure that I have referenced both d3.js and cal-heatmap.js correctly in my project.

Is this a typings thing? I thought it was, so I included the following in my package.json dependencies however it made no difference:

Any idea how I can correct this and get cal-heatmap running on my heroku instance?

UPDATE I was referencing the very latest version of d3.js, so I decided to try referencing the recommended version on http://cal-heatmap.com/ (v3.5.6). I now get the following errors:

enter image description here

I'm still unsure what needs to be done to correct this.

Upvotes: 0

Views: 175

Answers (1)

UrbanCondor
UrbanCondor

Reputation: 83

Solved the issue. The later error was because the #cal-heatmap div could not be found. I this it was because I placed a *ngIf condition on the #cal-heatmap div (for the purposes of displaying a spinner whilst the cal-heatmap loaded). This caused a problem whereby the code couldn't find the #cal-heatmap div because it didn't exist / wasn't shown yet. All I needed to do was remove the *ngIf condition and the cal-heatmap loaded / displayed.

I believe the initial problem did relate to a more recent version of d3.js being referenced, so I made sure I referenced v3.5.6 too.

Upvotes: 0

Related Questions