How to render multiple charts in custom widget
Hey everyone, been playing around with Filament for like a week now, for today I wanted to render multiple charts inside a custom widget, I haven't found a good way yet, was wondering if there're any suggestions or even examples anywhere
12 Replies
Any ideas?
You would have to do a custom widget that either supports multiple charts, or allows for using multiple widgets inside it. Nothing out of the box though.
So there's no way I could use filaments chart's code?
Sure you can, but you would have to wrap the widgets in a custom widget. They are just livewire components. What I’m getting at though is that Filament’s chart widgets only support one chart per widget.
That should be no problem I think, I could probably just use the blade foreach to iterate over it I guess?
They really aren’t that complicated. Should be fairly easy to make a custom widget that allows for multiple charts.
Guess I'd just iterate over the <div> with the ax-load? https://github.com/filamentphp/filament/blob/3.x/packages/widgets/resources/views/chart-widget.blade.php
With my own data etc tho
Sort of. But you’d still need to scope each chart instance since they can all have different colors, labels etc.
Nice I did that I think, btw is there any reason why Filament doesn't ship with the full tailwind suite? Was playing around with margins and noticed all the margin 8s are missing
Because that’s not how tailwind works. Also the full tailwind css is like 10mb. Lol. That’s why it has a build step. It purges unused classes to keep the build as small as possible.
But that’s also why Filament has themes so you can customize it with your own TW build.
Sounds fair, thank you, do you know if anyone would be interested in an openapi plugin for filament? Doing it for this project thinking about releasing it
I think there might be one. But always room for more. Guess it really depends on the use case on the implementation. Like ai for content can be a totally separate thing from ai for like seo descriptions, etc.