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

Hi @alex4

Edit to include another question:

Sorry if this is covered somewhere and I missed it - is there a way to have ‘Show Data Labels’ on, but hide the label when the value is zero? I am specifically looking to do this on bar and pie/donut charts. I’ve attached a screenshot with arrows pointed to the problematic zeroes. I’ve tried a few workarounds by tweaking colors and label placements, but each one introduces new issues.

I would also love to use horizontal bars but I’m finding the hover state gets buggy and confuses the series data when the orientation is switched. See below. Is there a workaround for this?


Any advice would be appreciated. Thanks!

Oops! :speak_no_evil: Sorry if i jumped the gun.

Hi @andyestridge thanks for reaching out! On the documentation tab, you can click on the Scatter Charts option to see the Scatter Charts with a mixed Scatter/Line Chart example. The Line Chart in the mix is not a pre-calculated Trendline (to allow for flexibility on your end), so you’ll need to calculate the two points for your Line in a Bubble expression in order to achieve a Trendline. Let me know if you have any further questions!

Hi @julia.bartine thanks for the feedback!

  1. Currently, you can’t turn on/off data labels based on a specific value but I can think about how we can build more customization around this aspect as I can see this being a helpful feature. Will keep you posted.
  2. Regarding Horizontal Bar Chart tooltips – thanks for making me aware of this issue. Please look out for a fix within the week – I’ll make an announcement!

Alex

@mihira – ha! No worries, hopefully I will be able to make the announcement soon!

Amazing, thanks for looking into it!

@julia.bartine – thanks again for the feedback and request here. I just pushed an update and once you upgrade to v4.11.3 or greater, Horizontal Bar Charts should now properly show the default tooltip! Let me know if you have any more feedback (I’m looking into your other request soon as well!)

@alex4 - apologies if this has already been asked in this thread.

I’m trying to use your Bar Chart dynamically, but I need to make the Series Names for the charts dynamic, as well as the Y-Values. it looks like most of your examples aren’t set up this way.

For context, I’m working on an app for employees at a company to join employee resource groups (ERGs - basically like internal clubs that most companies have) on a self-serve basis. So a user can join any ERG for their company anytime they want. Each company has it’s own sub-app. In the setup, I go in and list out the offices, levels, and departments within the company so employees can assign themselves to one when they create their accounts. All users for a sub-app work for the same company (for simplicity, let’s say they all work for Facebook). Within Facebook’s app, each user is associated to an Office (ie: Dallas, TX), a level (ie: Senior Manager) and a Department (ie: Marketing). I’m trying to create bar charts that would allow admins to see ERG membership broken down by office, department, and team. Because each company’s offices/departments/teams are different, and because they number of each may vary, I need the Series Name and the Y-Values to be dynamic.

Does that make sense? I really like the set up and customization options for your charts, so I definitely want to use them.

Hey @Toby1 — thanks for reaching out! If you have an existing implementation for your app, could you DM me a link to your editor please? I’d like to take a look, I’m not sure I fully understand the roadblock you’re facing so taking a peek at so the editor would be helpful

Cheers,
Alex

Hey there Alex! I just purchased your chart plugin. It looks good and is pretty easy to use! Can you share with me how to use the Complex List Calculations element? What is it for?

I see. Thank you and I am looking forward to it!

Update v4.13.0: Bar/Line Charts: Draggable Data Values

Hi all, an exciting new update for Bar, Line, and Area Charts. You can now set a Bar/Line Charts to enable draggable data points. Here is a screenshot of the new properties, where you turn on/off “Draggable Values?” and set the number of decimals dragging a value should be rounded to with “Drag Data Rounded”:
drag data options

There is a new demo of draggable bar charts on the “Customizations” tab of the demo page.

Hopefully this can add a level of interactivity to your Charts if needed. As always, don’t hesitate to reach out with feedback! Enjoy!

Alex

1 Like

Awesome! I was hoping for this one, thank you. Now if we could only choose our own icon/character for datapoints … :wink:

1 Like

@christo1 glad to hear this new feature will be helpful to you!

The feature for custom icons for data points is still on my list. Will make an announcement when I am able to get to that. Don’t hesitate to reach out with more feedback – keep the feature requests coming!

That’s good to know :slight_smile: I’ll be patient

@christo1 – you got it! Thank you so much for the support :slight_smile:

Update v4.14.0: Scatter/Point Charts: Draggable Data Values

Hi all, as follow up to the update from 4.13.0, you can now enable Scatter/Point Charts with draggable data points as well! Here is a screenshot of the new properties, where you turn on/off “Draggable Values?” and set the number of decimals dragging a value should be rounded to with “Drag Data Rounded”:
scatter_chart_draggable

Here are the values that are published (e.g. “Dragged Item’s Start/End X Value”):

Don’t hestitate to reach out with feedback!

Happy Bubbling,
Alex

For me, performance is the most important aspect of development. While your plugin is great, unfortunately it loads all js and css libraries even in pages that do not require them. As an example, We have one type of chart on this page, but has loaded all the Chart.js plugins libraries available.

It would be perfect if the plugin loaded only the libraries related to the chart we’re using, and the chart.js main library was loaded only in the page we are using charts.

We only need one kind of chart most of the time, so loading all of them is terrible for SEO and page speed.

Can you fix this? Just need this fixed to buy immediatelly. Thank you.

Hey @dan.artmx — thanks for the kind words and feedback! Per @mihira’s request, I’m currently working on this; there were some bigger issues that arose associated with moving the libraries to the element level instead of the plugin level so it has taken a but longer than expected but I should have something released early next week!

Have a great weekend!
Alex

1 Like

Hey @alex4 , thanks a lot! Once you’re done, you’ll have the best chart plugin of the entire Bubble ecosystem. Looking forward to it.

Growth tip: Once it’s released, mention on your sales page that it was carefully built for performance. Sales will go through the roof, trust me :slight_smile:

There are a lot of folks like me who don’t buy plugins that can compromise the performance of their app, and most just pass and don’t tell the developer. The developer ends up losing tons of sales.

I’m glad to help.

1 Like

Thanks for the tip @dan.artmx! Working on the update as we speak — hope it can be a helpful improvement for folks like you when it’s ready :+1: