Chartkick是否允许用户标记x/y轴?
Sample Code:
<%= line_chart Product.group("purchased").maximum(:price) %>
Run Code Online (Sandbox Code Playgroud) 我正在使用chartkick gem来显示图表.我已经按照正确的安装文档,但每当我尝试使用他们的方法时
timeline [["Washington", "1789-04-29", "1797-03-03"], ["Adams", "1797-03-03", "1801-03-03"], ["Jefferson", "1801-03-03", "1809-03-03"]]
Run Code Online (Sandbox Code Playgroud)
它在firebug中显示错误 ReferenceError:未定义Chartkick
我正在使用Chartkick在Ruby-on-Rails项目中显示一些statisitcs数据.Chartkick基于Google Charts.有没有办法在图表的图例中自定义数据输出?
例如:
= pie_chart User.get_country_statistic, library: {legend: {position: "left"}, chartArea: {left:0, width:'100%'}}
Run Code Online (Sandbox Code Playgroud)
它给

但是我需要这样的东西:

也就是传说中的更多信息.我怎么能得到它?
是否可以更改使用Chartkick创建的柱形图的颜色?我在文档中搜索了它,但我找不到任何关于它的内容.有任何想法吗?
我正在使用一个非常好的gem来使用Ruby on Rails创建图表.但我正在努力制作一个用直线连接圆点的折线图.它总是创造曲线.我需要直线.另外我想知道是否有人知道如何从线上删除点.我找不到办法做到这一点.
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}] %>
Run Code Online (Sandbox Code Playgroud) 我正在使用Rails 4,Wicked_PDF和Chartkick Gem的
Google图表我使用:
<%= javascript_include_tag"//www.google.com/jsapi","chartkik"%>
html视图提供了图表和所有预期的内容.当我将.pdf附加到网址时,pdf文档会在浏览器中显示,但ChartKick图表不会显示.
图表应出现以下错误:
加载图表时出错:找不到适配器
我在PDFKit文档中找到了以下内容.
资源不包含在PDF中:图像,CSS或JavaScript似乎没有在PDF中正确下载.这是因为wkhtmltopdf不知道在哪里找到这些文件.确保使用绝对路径(以正斜杠开头)到您的资源.如果您使用PDFKit从原始HTML源生成PDF,请确保使用完整路径(包括域的文件路径或URL).在限制性服务器环境中,root_url配置可能是您要更改资产主机的内容.
我假设wkhtmltopdf没有找到图表的链接,但我不知道如何解决这个问题.
有没有人有建议?
我找到了这个链接:
在wicked_pdf中渲染jQuery
Unixmonkey帮助FattRyan为Highcharts解决这个问题.
任何人都可以帮助如何设置此wicked_pdf_javascript_include_tag,以便Wicket_PDF可以使用Google图表接受Chartkick的图表吗?
我有每天由用户通过表单添加的数据.这些领域中的一些记录温度:ambcur,:ambmin,:ambmax等这是托盘的所有部分,其中包含数据记录
我正在使用chartkick并且很棒,但我不确定如何随时间显示数据.
我试图做一个多重系列线图.
<%= line_chart [
{name: "Series A", data: @tray.datalogs.ambcur},
{name: "Series B", data: @tray.datalogs.ambmin}
] %>
Run Code Online (Sandbox Code Playgroud)
此外,单个线图也不起作用.
<%= line_chart @tray.datalogs.group(:ambcur).count %>
Run Code Online (Sandbox Code Playgroud)
有人可以帮助引导我朝着正确的方向前进吗?谢谢 :)
我想将垂直柱形图转换为水平堆积条形图。我使用chartkick-vue0.61 和chart.js3.0-beta。
我当前的代码:
<column-chart :data="chartData" suffix="%"
height="200px"
:colors="[['#28a745', '#007bff', '#ffc107', '#dc3545']]">
</column-chart>
Run Code Online (Sandbox Code Playgroud)
呈现方式如下:
我找到了这个文档,但我不知道如何将其传递给chartkick-vue,所以我从单杠开始:
<bar-chart
:data="chartData"
suffix="%"
height="200px"
:colors="[['#28a745', '#007bff', '#ffc107', '#dc3545']]"
>
Run Code Online (Sandbox Code Playgroud)
但它失败了:
Error Loading Chart: "horizontalBar" is not a registered controller
Run Code Online (Sandbox Code Playgroud)
这是代码沙箱:https://codesandbox.io/s/pective-williamson-upohe
我该如何解决?
我使用Chartkick来显示多个系列折线图.代码如下: -
<h1>Multiple Series Line</h1>
<div id="chart-4" style="height: 300px;"></div>
<script>
new Chartkick.LineChart("chart-4", [{"name":"Workout","data":{"2013-02-10 00:00:00 -0800":3,"2013-02-17 00:00:00 -0800":3,"2013-02-24 00:00:00 -0800":3,"2013-03-03 00:00:00 -0800":1,"2013-03-10 00:00:00 -0800":4,"2013-03-17 00:00:00 -0700":3,"2013-03-24 00:00:00 -0700":2,"2013-03-31 00:00:00 -0700":3}},{"name":"Go to concert","data":{"2013-02-10 00:00:00 -0800":0,"2013-02-17 00:00:00 -0800":0,"2013-02-24 00:00:00 -0800":0,"2013-03-03 00:00:00 -0800":0,"2013-03-10 00:00:00 -0800":2,"2013-03-17 00:00:00 -0700":1,"2013-03-24 00:00:00 -0700":0,"2013-03-31 00:00:00 -0700":0}},{"name":"Wash face","data":{"2013-02-10 00:00:00 -0800":0,"2013-02-17 00:00:00 -0800":1,"2013-02-24 00:00:00 -0800":0,"2013-03-03 00:00:00 -0800":0,"2013-03-10 00:00:00 -0800":0,"2013-03-17 00:00:00 -0700":1,"2013-03-24 00:00:00 -0700":0,"2013-03-31 00:00:00 -0700":1}},{"name":"Call parents","data":{"2013-02-10 00:00:00 -0800":5,"2013-02-17 00:00:00 -0800":3,"2013-02-24 00:00:00 -0800":2,"2013-03-03 00:00:00 -0800":0,"2013-03-10 00:00:00 -0800":0,"2013-03-17 00:00:00 -0700":1,"2013-03-24 00:00:00 -0700":1,"2013-03-31 00:00:00 …
使用chartkick带wicked-pdf。
应用程序/布局/pdf.html.erb
<!doctype html>
<html>
<head>
<meta charset='utf-8' />
<%= wicked_pdf_stylesheet_link_tag 'application', media: 'all' %>
<%= wicked_pdf_javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<%= javascript_include_tag "http://www.google.com/jsapi"%>
<%= wicked_pdf_javascript_include_tag 'chartkick'%>
</head>
<body onload='number_pages'>
<div id="header">
<h2>Report</h2>
</div>
<div id="content">
<%= yield %>
</div>
Run Code Online (Sandbox Code Playgroud)
但它在这条线上给出了一个错误
<%= wicked_pdf_stylesheet_link_tag 'application', media: 'all' %>
Run Code Online (Sandbox Code Playgroud)
错误
undefined method `start_with?' for nil:NilClass
Run Code Online (Sandbox Code Playgroud)
我如何删除这个?错误
ActionView::Template::Error (undefined method `start_with?' for nil:NilClass):
2: <html>
3: <head>
4: <meta charset='utf-8' />
5: <%= wicked_pdf_stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' …Run Code Online (Sandbox Code Playgroud) 我正在尝试设置一个多系列折线图,按模式显示每月总考试。
类似于此图表的内容:
我希望对模态进行着色:(CT、MR、US、XR、MG、BD、NM)
每月日期 (to_date) 将是 X 轴数据标签。
考试模式:
has_many :modalities
Run Code Online (Sandbox Code Playgroud)
模态模型:
belongs_to :exam
Run Code Online (Sandbox Code Playgroud)
我的 Charts 控制器有一个monthly_modalities 操作:
def monthly_modalities
chart_data = Modality.joins(:exam).map {|m|
{name: m.name, data: m.exam.to_date}
}
render json: chart_data.each do |e|
{name: :name, data: e.group_by_month(:to_date, format: '%b', range: 1.year).sum(:total).chart_json}
end
end
Run Code Online (Sandbox Code Playgroud)
这是创建的图表:
问题是重复模式没有组合在一起,并且月度日期 (to_date) 没有显示在 X 轴数据标签上。
我有两个数据集,其中包含人工智能自动收集的数据和人类手动收集的数据。我目前使用Chartkick for Rails将它们显示为两个单独的柱形图:
如上所示,人工智能数据显示为堆积柱形图,显示已确认、拒绝和未验证数据的细分,因为我们仍然进行确认检查以查看人工智能的准确性,而人工操作数据按原样显示,因此,无需使用堆积柱形图。
现在,我想要实现的是并排显示人工智能和人工操作数据(分组),同时保持人工智能数据的堆叠属性。所以它应该看起来像这样:
我目前拥有的两个单独图表的代码是:
controller
# Data for Stacked Column Chart
@ai_operated_data = [
{
name: "Confirmed",
data: PotentialViolator.where(confirmation_status: 1).group_by_week(:capture_time).count
},
{
name: "Rejected",
data: PotentialViolator.where(confirmation_status: 0).group_by_week(:capture_time).count
},
{
name: "Unverified",
data: PotentialViolator.where(confirmation_status: -1).group_by_week(:capture_time).count
}
]
# Data for Single Column Chart
@human_operated_data = [
{
name: "Human Operated Data",
data: ManuallyCaughtViolator.group_by_week(:capture_time).count
}
]
Run Code Online (Sandbox Code Playgroud)
view
<div class="ui container">
<h1>Performance Analytics</h1>
<div class="ui divider"></div>
<%= column_chart @ai_operated_data, stacked: true %>
<%= column_chart @human_operated_data %>
</div>
Run Code Online (Sandbox Code Playgroud) 我想使用“Chartkick”和 Vue 创建一个图表。但它无法正常工作,并且出现一些错误。错误:
\n\n\n./node_modules/vue-chartkick/dist/vue-chartkick.esm.js 23:13-14\n"在“vue”@\n 中找不到导出“h”。/node_modules/vue-chartkick/dist/vue -chartkick.esm.js @\n./src/main.js @ multi\n(webpack)-dev-server/client?http://localhost:8080\nwebpack/hot/dev-server ./src/main .js
\n
main.js:
\nimport Vue from 'vue'\nimport VueRouter from 'vue-router'\nimport { BootstrapVue, IconsPlugin } from 'bootstrap-vue'\nimport Chartkick from 'vue-chartkick'\nimport Chart from 'chart.js'\n\nimport 'bootstrap/dist/css/bootstrap.css'\nimport 'bootstrap-vue/dist/bootstrap-vue.css'\n\nVue.use(Chartkick.use(Chart))\nVue.use(VueRouter)\nVue.use(BootstrapVue)\nVue.use(IconsPlugin)\n\nVue.config.productionTip = false\n\nimport App from './App.vue'\nimport Home from './components/pages/Home.vue'\nimport Products from './components/pages/Products.vue'\n\nconst router = new VueRouter({\n mode: 'history',\n routes: [\n { path: '/', component: Home, name: 'index'},\n { path: '/products', component: Products, name: 'products'},\n ],\n\n /*\n scrollBehavior (to, from, savedPosition) {\n if …Run Code Online (Sandbox Code Playgroud)