# Chart.js killing me softly **URL:** \ **Category:** Ask the community\ **Tags:** question, code\ **Created:** [June 21, 2020, 7:52pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898 "2020-06-21T19:52:47Z")\ **Posts on this page:** 19\ **Page:** 1
**Author:** ![tranenpeter](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tranenpeter/32/18968_2.png) [@tranenpeter](https://forum.wixstudio.com/u/tranenpeter)\ **Post date:** [June 21, 2020, 7:52pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/1 "2020-06-21T19:52:47Z")
Can anyone get the example from [https://www.wix.com/corvid/example/chart.js-custom-element](https://www.wix.com/corvid/example/chart.js-custom-element) to work? I have premium Wax without any ads. Followed the example perfectly. Console log on data is looking fine but nothing shows up. Can anyone get it to work? I feel like its a detour to install chartjs nom rather than just embed an iframe with html code. ---
**Author:** ![marlowe-shaeffer](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/marlowe-shaeffer/32/669_2.png) [@marlowe-shaeffer](https://forum.wixstudio.com/u/marlowe-shaeffer)\ **Post date:** [June 22, 2020, 7:13pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/2 "2020-06-22T19:13:22Z")
Hi Peter, Thanks for letting us know. We’ve heard a few complaints recently about this example, so we’re investigating. Stay tuned! ---
**Author:** ![tranenpeter](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tranenpeter/32/18968_2.png) [@tranenpeter](https://forum.wixstudio.com/u/tranenpeter)\ **Post date:** [June 22, 2020, 7:54pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/3 "2020-06-22T19:54:48Z")
Hi Marlowe, Thanks for the reply. I am working on it as well. I think it might be a permission issue with the custom element itself because the error: “typeerror: attempted to assign to readonly property” is reproducible on three points: 1. Front-end page code 2. Public “custom-elements”: chart.js 3. Public: chart-api.js This is a screenshot of the error I get and a link to my website [https://www.nordicelysium.com/members](https://www.nordicelysium.com/members). Please let me know if there is anything else I can because we are very much depending on chart.js p.s I tried your “Hello World” example and it works so maybe render? ![](https://us1.discourse-cdn.com/wix/original/3X/8/0/8096ff05aeccbc788073c6b940ea342c92701c22.png) ---
**Author:** ![diazcalvi](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/diazcalvi/32/22048_2.png) [@diazcalvi](https://forum.wixstudio.com/u/diazcalvi)\ **Post date:** [July 21, 2020, 8:48am UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/4 "2020-07-21T08:48:51Z")
Any news on this. Thanks for the help! I need to know how to make it work ---
**Author:** ![marlowe-shaeffer](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/marlowe-shaeffer/32/669_2.png) [@marlowe-shaeffer](https://forum.wixstudio.com/u/marlowe-shaeffer)\ **Post date:** [July 24, 2020, 9:39pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/5 "2020-07-24T21:39:18Z")
The fix is a bit more complex than anticipated, and we’re still looking into it. Thanks for your patience! ---
**Author:** ![marlowe-shaeffer](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/marlowe-shaeffer/32/669_2.png) [@marlowe-shaeffer](https://forum.wixstudio.com/u/marlowe-shaeffer)\ **Post date:** [August 11, 2020, 3:15pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/6 "2020-08-11T15:15:49Z")
Update—we’re still working on fixing the chart example. Hopefully we’ll have it resolved soon. Sorry for the delay! ---
**Author:** ![brainstorrrm](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/brainstorrrm/32/7052_2.png) [@brainstorrrm](https://forum.wixstudio.com/u/brainstorrrm)\ **Post date:** [August 11, 2020, 3:36pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/7 "2020-08-11T15:36:48Z")
I started with that sample and it failed: [https://www.wix.com/corvid/forum/community-discussion/solved-charts-js-floating-bars?origin=member\_posts\_page](https://www.wix.com/corvid/forum/community-discussion/solved-charts-js-floating-bars?origin=member_posts_page) Got the charts working - chart.js works fine with Corvid. ---
**Author:** ![brandonalvarado4](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/brandonalvarado4/32/23483_2.png) [@brandonalvarado4](https://forum.wixstudio.com/u/brandonalvarado4)\ **Post date:** [September 16, 2020, 12:55pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/8 "2020-09-16T12:55:18Z")
Any news by any chance? ---
**Author:** ![miguelhongo90](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/miguelhongo90/32/20930_2.png) [@miguelhongo90](https://forum.wixstudio.com/u/miguelhongo90)\ **Post date:** [September 16, 2020, 1:31pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/9 "2020-09-16T13:31:52Z")
Im working with dynamic charts alright, using Chart.js and some plugins. What I did was place an HTML element in the editor, copy paste the HTML code from the example\*, and from there I played with it, understood it, and now its ok. \*To get the html code, you can open the example in the editor, click in the HTML example element, copy the code inside settings, and paste it in notpad++, inspect it, and then put your own code in to your own HTML element ---
**Author:** ![brandonalvarado4](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/brandonalvarado4/32/23483_2.png) [@brandonalvarado4](https://forum.wixstudio.com/u/brandonalvarado4)\ **Post date:** [September 17, 2020, 12:59am UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/10 "2020-09-17T00:59:40Z")
@miguelhongo90 Thanks soo much for replying! I’m honestly having a really difficult time with this. I’ve been trying to get my data collection to interact with my graph but I just can’t seem to figure it out. The chart has yet to show up. Is there any way you could elaborate a little or maybe post an example? I‘ve tried manipulating the api and chart.js code and i’ve made sure my element id’s are all matched. I’d appreciate any response. Thank you! ---
**Author:** ![tranenpeter](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/tranenpeter/32/18968_2.png) [@tranenpeter](https://forum.wixstudio.com/u/tranenpeter)\ **Post date:** [December 1, 2020, 10:50am UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/11 "2020-12-01T10:50:48Z")
The example works now! ---
**Author:** ![mpichora](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/mpichora/32/28804_2.png) [@mpichora](https://forum.wixstudio.com/u/mpichora)\ **Post date:** [January 16, 2022, 3:18pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/12 "2022-01-16T15:18:14Z")
I can’t get this to work. If anyone can elaborate on what they did I would really appreciate it! Here’s what I’ve done: 1. I copied all code verbatim into js files as described, same names and all. 2. Created the custom element, adjusting the ID to match (#CustomElement1), changed source to ‘charts.js’ and tag to ‘chart-elem’. 3. Loaded charts.js package from npm (v3.6.0) 4. Adjusted the query for my data source. My data comes from arrays returned from one of my back-end functions, but the result is essentially the same: a number array, an array of labels, and an array for background color and border color). Console logs the data as expected. The chart still does not render. There is a line in charts.js: **if** ( **this**. \_connected ) **this**. render (); Am I missing something to connect the element? Did I lose something by sourcing data from a back-end function instead of a query as in the example? Thanks! ---
**Author:** ![jjohnson4him](https://avatars.discourse-cdn.com/v4/letter/j/9fc29f/32.png) [@jjohnson4him](https://forum.wixstudio.com/u/jjohnson4him)\ **Post date:** [January 31, 2022, 5:24pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/13 "2022-01-31T17:24:04Z")
I have EXACTLY the same issue and have done EXACTLY the same process as you have (except I have upgraded to v3.7.0) . I am getting the following console error log. chart.js:50 Uncaught TypeError: e.default is not a constructor at h.value (chart.js:50:19) at h.value (chart.js:44:9) at chart.js:71:23 at chart.js:71:44 value @ chart.js:50 value @ chart.js:44 (anonymous) @ chart.js:71 (anonymous) @ chart.js:71 here is the snippet of chart.js code with line 50 highlighted: render () { const ctx = **this**. \_shadow . getElementById ( ‘myChart’ ). getContext ( ‘2d’ ); const myChart = **new** Chart ( ctx , { type : ‘bar’ , data : **this**. chartData , options : { legend : { labels : { The data is coming back from my DB’s ok, all is good except for rendering. When I run the example provided (using the “Edit Now” button in the example) it all works fine, but when I put it into my published site…no bueno. I REALLY need this functionality. Any suggestions (from anyone?) ---
**Author:** ![amandam](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/amandam/32/79539_2.png) [@amandam](https://forum.wixstudio.com/u/amandam)\ **Post date:** [January 31, 2022, 9:18pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/14 "2022-01-31T21:18:41Z")
Hello. The latest version of ChartJS (released December 2021) likely has introduced a breaking change in the code. I wasn’t able to get the example code working with v3.7.0 today and I have to stop messing with it for now, but I was able to get the example chart to render as expected by using an older version of ChartJS. To do this, I removed the NPM package and loaded the CDN version in by adding header scripts in settings. If you have time, I would review the ChartJS docs and forums to see if you have better luck tracking down the breaking change than I did. ---
**Author:** ![jjohnson4him](https://avatars.discourse-cdn.com/v4/letter/j/9fc29f/32.png) [@jjohnson4him](https://forum.wixstudio.com/u/jjohnson4him)\ **Post date:** [January 31, 2022, 10:40pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/15 "2022-01-31T22:40:53Z")
Thanks Amanda…I will give this a try. ---
**Author:** ![spamushere](https://avatars.discourse-cdn.com/v4/letter/s/df705f/32.png) [@spamushere](https://forum.wixstudio.com/u/spamushere)\ **Post date:** [February 3, 2022, 1:57pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/16 "2022-02-03T13:57:37Z")
@jjohnson4him See if you can get this instructional working, it failed for me [https://www.wix.com/velo/forum/coding-with-velo/chart-js-not-rendering-on-editor-x](https://www.wix.com/velo/forum/coding-with-velo/chart-js-not-rendering-on-editor-x) ---
**Author:** ![mpichora](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/mpichora/32/28804_2.png) [@mpichora](https://forum.wixstudio.com/u/mpichora)\ **Post date:** [February 20, 2022, 2:54pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/17 "2022-02-20T14:54:08Z")
@jjohnson4him Any luck? ---
**Author:** ![mpichora](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/mpichora/32/28804_2.png) [@mpichora](https://forum.wixstudio.com/u/mpichora)\ **Post date:** [February 20, 2022, 3:18pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/18 "2022-02-20T15:18:17Z")
Thanks Amanda. Getting charts working on my site has been the most frustrating part of my Wix/Velo experience for the past 4 months. Granted, I am not a pro developer but I have not encountered any other issues that I haven’t been able to figure out relatively quickly, and I have been very happy with Wix/Velo overall. Is this something that you and your team can elaborate on with more functional examples & documentation? I am trying to implement charts to display user performance trends on my math trainer website. Here’s a link to the page I am using to experiment with charts. [https://www.zeramath.com/chartjs.](https://www.zeramath.com/chartjs.) Thanks for the help! ---
**Author:** ![amandam](https://sea1.discourse-cdn.com/wix/user_avatar/forum.wixstudio.com/amandam/32/79539_2.png) [@amandam](https://forum.wixstudio.com/u/amandam)\ **Post date:** [February 21, 2022, 2:01pm UTC](https://forum.wixstudio.com/t/chart-js-killing-me-softly/31898/19 "2022-02-21T14:01:04Z")
@mpichora Hello. A few things… The error you are getting is from chart.js and we have no control over it. You can tell by looking at the console and clicking on the file throwing the error. ![](https://us1.discourse-cdn.com/wix/original/3X/1/1/11b289036028d9bbad4600cf371c39ab6c033e8c.png) This means that chart.js is set up incorrectly. If you used the example that is currently out of date due to a ChartJS update that included breaking changes which we cannot control, then you will need to follow the steps I provided for how to revert to a previous version of chartJS (remove the NPM package and instantiation and swap to using header scripts) or, if you want to use their updated version you will want to visit their documentation and follow the examples they have provided. Here is [the post](https://www.wix.com/velo/forum/coding-with-velo/chart-js-not-rendering-on-editor-x) where I walked through the steps in more detail Now, to help with your exact scenario if you are having trouble, would you please do the following: Start a new post with your issue and show all your code including where you replaced the script in the head (if you are trying to revert to an older version) Tell us anything you have already tried - so you get new suggestions. I am closing this post because it is very old and getting messy but if you are still having issues, please open a new one. On my end, I will look into having that example taken down for now as it is clearly confusing since it broke due to a ChartJS update. When we release examples for third party tools, we have no control over what they may do in the future with their code but I do apologize that it’s confusing currently as I see the version is not explicitly listed on that example.