Hello everyone,
I've created a plugin to render a chart based on a markdown table.
Let me know what you think of it.
23 Likes
Neat! So exciting to see all the work being done.
Thanks!
Nice !
Did you plan to had in the repo ? it's not in the plugin repo yet, which means people won't find it from within Joplin 
Thanks @bepolymathe for mentioning it, I wasn't aware of that step.
It seems that a nice soul (or a clever bot?) added it in the meantime. It's now searchable within Joplin 
.
2 Likes
Great ! Thanks for that 
That's a really useful plug-in, thank-you!
Just a suggestion, but for any later version the ability to restrain the width of the SVG chart as part of the "fencing" markdown would be handy. Being set at 100% width they can get a bit big!
Not going to stop me using it though! 
2 Likes
Great! Thanks you @SamuelGagnepain
Glad to hear. Thanks for posting. @dpoulton, you're right it's not ideal in that case. I've pushed a v1.0.2 fix for it as it was not too complicated.
3 Likes
Just discovered this plugin and absolutely love it. C'est génial! Bravo! I quickly could add visualisation to the table I already had in seconds. C'est très bien.
Est-ce qu'il y aurait un moyen que les dates soient en français?
Super if it's useful 
Is their a way to see the dates in French?
From what I see in d3js documentation (the visualisation library I used), it doesn't seem to be straightforward unfortunately. Ideally we would pass a language variable to 'd3-scale' but I don't see such option. If anyone has more expertise on the subject, I'd be happy to accept Pull Request.
1 Like
Thanks for the quick answer and thanks again for the great plugin 
I have another question. On the horizontal line, could it be possible to adapt text to go from horizontal to vertical when the line is too crowded (by names for exemple). Another question would be if it would be possible to have other kind of charts (like other that exist in the d3) and graphs (or lines... like more smooth lines?)
1 Like
Thanks for the plug-in.
You mentioned three data types can be used, number, dat and category.
I assume the two gif samples are the date and number data type, but could you show an example for category, please?
I’m not clear on * category : string value as a discrete range and how that can be used.
Oh, about the date graphing, is it possible to have a dot appear on the representing line as to what value is being charted?
Ex: for 2019, 2 apples and 1 pear it’s hard to know where the 1 pear is even identified. Just a thought.
1 Like
This is such a cool plugin! I was wondering if there is any way to use this together with the markdown table calculations plugin? Right now these two plugins seem mutually incompatible.
First problem is that if using a formula directly under a table, it will show up on the x-axis:
Secondly, because I have to place the chart inside a code block, the table calculations plugin doesn't see the table and won't do calculations anymore.
Finally, if I use inline cell formulas the chart won't render at all:
Maybe it could be made to work if anything between <!--TBLFM or <!--FM and --> were ignored. Not sure how to solve the second issue though.
Good question. It is possible but it will probably overlap with the unit label below the xAxis. I went for an alternative approach. In the last version v1.1.0, you will now be able to pass extra options below the table to specify stuff like the format of the axis (xAxisFormat and yAxisFormat) and the number of ticks (xAxisNbOfTicks and yAxisNbOfTicks).
This would lead to a rabbit hole of configuration to maintain and I don't think I'm ready for that 
.
I will check. It might be simple enough to do.
The first gif in the readme shows a category type and the second shows a date type. I was probably not super clear about this concept in the doc sorry for that. When I'm talking about the type I'm referring to the type of the xAxis. I renamed the option xAxisType to make it more obvious but don't hesitate to let me know if it's still fuzzy.
That would be an amazing combination . To build up on your suggestion, I think I could even ignore anything that is inside <!-- and -->. I need to dig more into that...
1 Like
@shbach For info the v1.2.0 now support comments. Could you tell me when you have time if it unlocks the markdown table calculations plugin?
@SamuelGagnepain Comments now don't cause issues with the chart rendering properly so thanks! However, it doesn't unlock the markdown table calculations plugin. As far as I understand it, whenever I click the "Calculate table formulas" button 
the plugin will look for a table with the table formulas and do the calculations. However, it doesn't look inside code blocks. Not sure the solution for this and if it is something that should be done on your end or the other plugin. To try yourself you can install the plugin, and use this example:
```turnToChart
| Column A | Column B | Column C |
|:---------|:---------|:----------------|
| 123 | 456 | 789 |
| 0 | 0 | <!--FM A1+C1 -->|
```
Hello @shbach, I just saw your message Plugin: markdown table calculations - #24 by shbach.
I agree. That seems to be the best approach to make the 2 plugins work together.
1 Like
Hey @GabrielMPhi, a little update on your initial question:
Is their a way to see the dates in French?
It turns out I was wrong. There was a not too complicated way to translate the dates. So I've implemented it on the v1.3.0. For more info, you can check the customLocale option in the doc.
2 Likes
Hi @SamuelGagnepain it is working perfectly! It's great! Thanks.
Thanks also for the answer for my previous question. The plugin is great! Thanks again
@SamuelGagnepain I'm happy to report that the markdown table calculations plugin is now compatible with turn to chart. So I can make calculations and have it immediately reflected in the chart which is pretty cool!
I do have one more question/suggestion though. For the legend is there a reason why it is oriented vertically? I think it would make more sense for it to spread out horizontally, whereas the vertical orientation would make more sense if the legend was on the side of the chart.
3 Likes