Do you see a JS error when trying the code?
Is there somewhere I can see it in action with your theme?
No JS error found in browser console.
I have created a test page to reproduce this problem:
https://www.qingning.bio/test
If you need any other information, please let me know.
@fulibaba
I spent some time poking at this and I’m still not quite sure what’s happening. Chart.js is supposed to honor the height applied to the canvas object. And for some reason in this case it’s not, and it’s actually setting it higher than it was set. I’m gonna see if I can duplicate this locally somehow.
But can you confirm that the chart in the first tab on your example is indeed the same chart as in the second tab and that it’s height is explicitly set to: 300px as it seems?
Yes, it is the same chart in both tabs.
I re-adjusted the test page, and now the content in the two tabs is exactly the same, and I wrote the set height into the title, which may be helpful to you.
@fulibaba sorry for the delay on this. Life has been a lot the last few months.
I’d like to ask you to try enabling the iframe embed option in the M Chart Settings panel. And see if that solves the issue. If it does not, please let me know?
Thanks for your reply.
I’ve tried enabling the iframe embed option, but it still doesn’t work. I have attached screenshots for your troubleshooting.
*https://imgur.com/a/ojhXSBT
OK, this one is really weird. I’m not quite sure why it’s happening yet but something is causing the canvas objects to always have a height of 600px despite me hard coding the height into the canvas object itself. This happens on my end too (though it didn’t use to). I think it might be inside of Chart.js that this is happening but I’m not sure yet.
However, I do have a possible fix. If you can email me at jamie AT methnen.com and let me know on here when you’ve done so I’ll send you an updated copy of M Chart and if you can test it out I’d appreciate that.
Thanks for your reply, I have send an email to jamie AT methnen.com via Gmail.