Making line straight in a line_chart using chartkick and removing dots

Question

I am using a very nice gem to create charts using Ruby on Rails. But I am struggling to make a line chart with straight lines connecting the dots. It always creates curves. I need straight lines. Also I want to know if someone knows how to remove the dots from the line. I could not find a way to do it.

Chartkick.options = {
  height: "300px",
  min: -5, 
  max: 10,
  discrete: true,
}

<% series_a = {"10" => -5, "11" => 9,"12" => 3,"13" => -1,"14" => 4,"15" => -2,"16" => -4} %>

<%= line_chart [{name: "Series A", data: series_a}] %>

Derek Halden · Answer 1 · 2014-06-11T16:20:53.687

9

So, you need to use 'library'. That lets you describe any preferences you have from Google charts, or from highcharts.

So you'll probably want to do something like the following:

<%= line_chart [{name: "Series A", data: series_a}], library: {curveType: "none", pointSize: 0}  %>

Two things about the above line. Firstly, I do not normally use ruby-on-rails, so syntax may be off. Secondly, if you are using highcharts, it probably won't be {curveType: "none", pointSize:0} that is GoogleChart specific. For highcharts, you will have to lookup the highchart options, and look for something similar.

edited Jun 11 '14 at 16:20

answered Jun 11 '14 at 16:04

Derek Halden

2,223
4
17
26

Am using chartkick and this answer doesn't seem to work – chrisgeeq Apr 23 '19 at 16:02
@chrisgeeq, this answer is 5 years old. Syntax might have changed a little. The syntax was also never guaranteed to be correct in the first place. – Derek Halden Apr 24 '19 at 17:26

score 3 · Answer 2 · answered Sep 10 '19 at 03:11

I know this thread is a bit old but it looks like an answer still doesn't exist here yet. This is a solution I just found while building out charts with Chartkick recently.

<%= line_chart [{name: "Series A", data: series_a}],
               curve: false,
               dataset: { pointRadius: 0} %>

Making line straight in a line_chart using chartkick and removing dots

2 Answers2