user9250616
user9250616

Reputation:

Change the font size of chart.js with chartkick

first of all, please excuse my english.

I'm a junior developer on Ruby on Rails and I developed an user management application, among other things. I'm working on the last feature that is generating statistics in a PDF using Chartkick and WickedPDF.

But, I have a problem because the generated JS has a very tiny font size. I tried everything, but nothing to do, I can not enlarge this font.

Here is the line that generates one of my graphs :

    <%= pie_chart Infosheet.group(:gender).count, library: {FontSize: 90} %>

This generate this code :

    <script type="text/javascript">
       new Chartkick.PieChart("chart-1", {"man":4}, {"library":{"FontSize":90}});
    </script>

But nothing change. I tried lots of other things that I do not have in mind anymore... In my PDF, the graph has a gigantic margin and a tiny font. :/

I despair because I have to return the project next week.

Can someone help me?

thank you very much

EDIT :

This is my statistics in my PDF :

https://i.gyazo.com/c86a39b2a9e529b7551f8654bee838b4.mp4

The font is... really tiny. my statistics have a size of 5000px x 5000px. Also, nothing changes if I increase the dpi of PDF

RESOLVED :

Finally, I forked chartkick to change the font-size directly into it, as no option was passed.

Upvotes: 0

Views: 1904

Answers (3)

Valiantsin Mikhaliuk
Valiantsin Mikhaliuk

Reputation: 56

There you are

  <%= pie_chart counters, library: { legend: { position: "left", labels: { fontSize: 26 } } } %>

Upvotes: 3

Mohit
Mohit

Reputation: 11

Use this code

<%= pie_chart Infosheet.group(:gender).count, library: {fontSize: 90} %>

Upvotes: 0

lacostenycoder
lacostenycoder

Reputation: 11226

I think you're passing the attribute with wrong case. Should probably be snakeCase and also try using a pixel size like so:

<%= pie_chart Infosheet.group(:gender).count, library: {fontSize: "50px"} %>


<script type="text/javascript">
   new Chartkick.PieChart("chart-1", {"man":4}, {"library":{"fontSize":"50px"}});
</script>

Upvotes: 0

Related Questions