# \[Plugin Update: 2021\] TechBlocks Charts and Graphs (Chart.js)

**URL:** <https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997>\
**Category:** Plugins\
**Created:** [April 12, 2021, 5:38pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997 "2021-04-12T17:38:26Z")\
**Posts on this page:** 20\
**Page:** 1

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 12, 2021, 5:38pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/1 "2021-04-12T17:38:27Z")

</div>

Hey Bubblers,

Since releasing the Simple Charts plugin in 2019, over 600 Bubble users have installed the plugin and provided lots of great feedback. Based on this feedback, we’ve added many new improvements including 100+ customizations, animations, click events, hover events, custom tooltips, and new chart types.

**Take a look at the big updates I’ve made to the demo page here:**  
[https://chartsdemo.bubbleapps.io](https://chartsdemo.bubbleapps.io)

**Bubble Plugin Page Link:**

> **[Chart JS - Charts and Graphs Plugin for Bubble, by TechBlocks](https://bubble.io/plugin/simple-charts-1553183744528x903111989944909800)**
>
> Chart JS - Charts and Graphs Plugin page on Bubble, by TechBlocks. Add Chart JS - Charts and Graphs in one click to your app. Bubble lets you build web apps without any code.

We’re always looking to improve the plugin, so as always, don’t hesitate to reach out with feedback and questions!

Alex  
[TechBlocks](https://techblocksco.com)

---

<div class="post-metadata">

**Author:** ![christo1](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@christo1](https://forum.bubble.io/u/christo1)\
**Post date:** [April 12, 2021, 6:09pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/2 "2021-04-12T18:09:08Z")

</div>

Love the plugin! I am however finding that if I have a line chart and conditionally show another series on the same chart, then the conditional series continues being shown even after the condition is not valid anymore. Refreshing the entire page is required to clear the conditional chart.

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 12, 2021, 8:50pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/3 "2021-04-12T20:50:03Z")

</div>

Thanks for the kind words @christo1!

Did you try adding/removing the extra series via workflow action? Feel free to DM me a link or screenshot of your editor implementation – I am more than happy to take a look.

Alex

---

<div class="post-metadata">

**Author:** ![JohnMark](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/johnmark/32/42431_2.png) [@JohnMark](https://forum.bubble.io/u/JohnMark)\
**Post date:** [April 12, 2021, 9:20pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/4 "2021-04-12T21:20:59Z")

</div>

Very attractive. I invite people to look at your demo. Congrats. 🥳  
I loved the 3rd column of the first dashboard, total bonus: 600M$ 😅

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 12, 2021, 10:52pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/5 "2021-04-12T22:52:56Z")

</div>

Thanks @JohnMark I appreciate the encouraging feedback. Let me know if you have any feedback on the demo or the plugin!

---

<div class="post-metadata">

**Author:** ![christo1](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@christo1](https://forum.bubble.io/u/christo1)\
**Post date:** [April 13, 2021, 6:16am UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/6 "2021-04-13T06:16:38Z")

</div>

Thanks for getting back to me.

I haven’t tried the workflow action. It is simply in a conditional. What I ended up doing is adding another chart and hiding and showing it instead. A bit clunky but avoids the issue.

---

<div class="post-metadata">

**Author:** ![carl.peterlin](https://avatars.discourse-cdn.com/v4/letter/c/82dd89/32.png) [@carl.peterlin](https://forum.bubble.io/u/carl.peterlin)\
**Post date:** [April 13, 2021, 8:17pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/7 "2021-04-13T20:17:38Z")

</div>

Hi, Alex!  
Amazing job with this plugin! It looks like just what I need.

I was on your demo site and read the instructions. BUT…there were no dynamic configurations of the chart data. Is there somewhere with examples of that? I’m not really having any success yet.

Thanks!

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 13, 2021, 8:48pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/8 "2021-04-13T20:48:15Z")

</div>

Hi @carl.peterlin thanks for reaching out and for the kind words about the plugin!

Here is a link to a page with a dynamic data example, let me know if this is helpful. Happy to create additional examples if needed:  
[https://chartsdemo.bubbleapps.io/dynamic-data-examples](https://chartsdemo.bubbleapps.io/dynamic-data-examples)

Alex

---

<div class="post-metadata">

**Author:** ![carl.peterlin](https://avatars.discourse-cdn.com/v4/letter/c/82dd89/32.png) [@carl.peterlin](https://forum.bubble.io/u/carl.peterlin)\
**Post date:** [April 13, 2021, 9:24pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/9 "2021-04-13T21:24:27Z")

</div>

Thanks, Alex! Looking now…

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 14, 2021, 9:13pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/10 "2021-04-14T21:13:26Z")

</div>

@christo1 understood, I’ll think through how I can make this less clunky

@carl.peterlin great, let me know if you have any questions!

---

<div class="post-metadata">

**Author:** ![christo1](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@christo1](https://forum.bubble.io/u/christo1)\
**Post date:** [April 15, 2021, 5:50am UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/11 "2021-04-15T05:50:04Z")

</div>

Another issue with the plugin. If I make the chart not visible using a checkbox, then it breaks the Zeroquode print plugin - won’t run. I then have to rather change the colour of the series with 100% transparency to hide it that way, then all works. The problem is when I have a chart with 4 colours in 4 series, the conditional to change the colours to 100% transparent does not work. For 2 series charts it works fine. I’ve made a video where I replicate the issue: [Screen Recording 2021-04-15...](https://share.getcloudapp.com/2NuwEOrB)

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 18, 2021, 4:41pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/12 "2021-04-18T16:41:39Z")

</div>

Hi @christo1 – hmm… the charts in this plugin are all built with standard HTML, CSS, Javascript as a Bubble element. I’m not sure how the Zeroqode print plugin was built but based on your description of the issue it sounds like it may be an issue with that plugin since it the charts are compatible with the [TechBlocks screenshot plugin](http://forum.bubble.io/t/new-plugin-updates-screenshot-image-generator/104260) and are able to appear fine on the PNG images generated on that plugin.

Also, thanks for your video regarding the color update issue with conditionals – I’ll take a look at it this week and get back to you!

Best,  
Alex

---

<div class="post-metadata">

**Author:** ![christo1](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@christo1](https://forum.bubble.io/u/christo1)\
**Post date:** [April 19, 2021, 3:34am UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/13 "2021-04-19T03:34:58Z")

</div>

Thanks Alex,

Those conditionals were driving me nuts until I landed on the work around. I am sure others may experience the same.

---

<div class="post-metadata">

**Author:** ![uzair7175](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/uzair7175/32/92272_2.png) [@uzair7175](https://forum.bubble.io/u/uzair7175)\
**Post date:** [April 19, 2021, 6:28pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/14 "2021-04-19T18:28:58Z")

</div>

Alex, I love this plugin. Just wanted to say, great job and thank you for the constant updates and improvements

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 19, 2021, 8:42pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/15 "2021-04-19T20:42:19Z")

</div>

Thank you @uzair7175 – I appreciate the kind words. Happy to hear that the plugin has been great for your use case!

---

<div class="post-metadata">

**Author:** ![uzair7175](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/uzair7175/32/92272_2.png) [@uzair7175](https://forum.bubble.io/u/uzair7175)\
**Post date:** [April 21, 2021, 7:49pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/17 "2021-04-21T19:49:09Z")

</div>

Hey there, is it possible to customize the thousands “,” for your charts? In my country we use “.”.

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 22, 2021, 6:32pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/18 "2021-04-22T18:32:40Z")

</div>

Yes, @uzair7175 — this is a property called “thousands separator” on the element inspector. Let me know if you can’t find it!

---

<div class="post-metadata">

**Author:** ![uzair7175](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/uzair7175/32/92272_2.png) [@uzair7175](https://forum.bubble.io/u/uzair7175)\
**Post date:** [April 23, 2021, 6:19pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/19 "2021-04-23T18:19:11Z")

</div>

I found it, Thank you so much!!! Really great work with this plugin!

---

<div class="post-metadata">

**Author:** ![alex4](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alex4/32/38254_2.png) [@alex4](https://forum.bubble.io/u/alex4)\
**Post date:** [April 23, 2021, 9:49pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/20 "2021-04-23T21:49:30Z")

</div>

@uzair7175 great to hear. Let me know if you have any other feedback. Always trying to improve the charts 🙂

---

<div class="post-metadata">

**Author:** ![Kent](https://avatars.discourse-cdn.com/v4/letter/k/b782af/32.png) [@Kent](https://forum.bubble.io/u/Kent)\
**Post date:** [April 23, 2021, 11:51pm UTC](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997/21 "2021-04-23T23:51:17Z")

</div>

@alex4 I’m working with a scatterplot that presents several series (necessary so that I can display different groups of colours of plotted dots) where I also need to be able to dynamically update the series data points based on user selections in the app (selections are made using check boxes and dropdowns). I was trying to achieve the dynamic data source by setting conditions on the series’ X and Y value sources when assigning them in the workflow, but the data sources don’t seem to update dynamically when the data source (e.g. a search) changes. Instead, I have to call the “Add a Data Series” workflow again (using the same series name as I used initially) any time I want to update the values that are displayed. This isn’t too much work, but in my use case the act of adding a new series (even though it is technically replacing an existing series) causes an animation and all data points come up from the bottom of the chart instead of updating instantly. Is there any way to turn this animation off? Perhaps there is a Chart.js setting that could be easily tapped into and a toggle added to the chart settings in Bubble?

[Next page](https://forum.bubble.io/t/plugin-update-2021-techblocks-charts-and-graphs-chart-js/145997.md?page=2)
