在 Rails 中使用 ChartKick 添加网格线

Question

使用 ChartKick with and chart.js 我想添加水平网格线。数据范围是 100 到 200..

我希望每 10 个单位有一条水平网格线。

<script src="https://cdnout.com/jquery/"></script>
<script src="https://cdnout.com/Chart.js/Chart.bundle.min.js"></script>
<script src="http://lib.arvancloud.com/ar/chartkick/2.3.0/chartkick.min.js"></script>

<%
  begin_tracking = Time.zone.parse('2021-03-24 18:33:00-07')
  current_date = Time.now 
%>

<%= line_chart DataTable.where(statdate: begin_tracking..current_date).pluck(:statdate, :data_ordinate), min: 100, max: 200, dataset: {borderWidth: 50} %>

我以为 dataset: {borderWidth: 50} 会这样做，但没有明显的效果。

文档引用：

To customize datasets in Chart.js, use:

<%= line_chart data, dataset: {borderWidth: 10} %>
You can pass this option to individual series as well.

Chart Kick 中的网格线一无所知，我不知道如何将 chart.js 转换为 Ruby。

Answer 1

所有选项的完整详细信息位于 https://www.chartjs.org/docs/latest/axes/styling.html。

一般形式是这样的：

<%= line_chart chart_path(@obj), 
  code: false,
  points: false, 
  min: 0, 
  max: 20, 
  colors: ["#0284C7", "#44403C"], 
  height: '105px', 
  width: '175px',
  library: { 
    scales: {           
      x: {
       display: false,
      },
      y: {
       display: true,
       font: {
          size: 6,
          weight: 100
      }
    }
  } %>

显示属性表示是否显示网格。

Answer 2

问题是我发现的 CDN 已过时。使用来自 jsDelivr 的 CDN，会显示网格线。时间刻度格式不同，但假设是可修复的。所以答案是正确的或在正确的道路上。谢谢。

在 Rails 中使用 ChartKick 添加网格线

Add Gridlines using ChartKick in Rails

javascript

ruby

ruby-on-rails

chartkick

chart.js