问题标签 [chartist.js]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
951 浏览

javascript - Javascript-如何通过 Chartist js 在饼图上制作叠加标签

我想知道如何使用 chartist js 来实现这种效果。
当鼠标进入时,标签就会出现。 我遇到了两个问题: 1.我知道如何添加事件监听器。数据类型“切片”只包含中心位置。 数据类型“标签”包含我想要的位置,但我不想显示标签,所以我设置了 showLabel:false。 2.我尝试附加html并设置z-index,x位置,y位置但没有奏效。 我能怎么做?
图片表单图表js




=====================(更新当前结果)======================== ====
这个项目是为了商业,所以我标出标题。
图片表单图表js
目前我不知道该怎么做。这是我的代码:

0 投票
1 回答
3428 浏览

javascript - Chartist 动态输入

我正在制作一个网站,用户可以在其中上传将显示为图表的数据

HTML:<div id="data"></div>

test1.php 输出:,-0.05,-0.07,-0.07,-0.07,0.14,0.14,0.09,0.07,0.07,0.07,0.07,0.65,0.63,0.63,0.63,0.63,0.63,0.58,0.56,0.56,0.56,0.56,0.84,0.79,0.77,0.77

js/jquery:

该图未显示,我收到错误

未捕获的错误:在优化缩放步骤时超过了最大迭代次数

但是,如果我$("#data").text().split(",").slice(1)在控制台中输入并将输出粘贴到标签和系列中,它可以正常工作,如果您将数据设为普通数组并且不从页面获取数据,它也可以工作

0 投票
1 回答
640 浏览

javascript - 如何设置基本 Chartist.js 图表

我感到迷茫,我阅读了 Chartist.js 的入门,它看起来非常简单,但我无法显示任何图表。

我制作了一个 rails 应用程序并获得了显示文本的欢迎页面,我链接了 css 和 javascript 文件,但我不确定如何让它显示。我创建了一个新的 js 文件,在文档中添加了他们拥有的数据并将其链接到主 HTML 页面,但什么也没显示?

0 投票
3 回答
3590 浏览

javascript - 将 javascript 数组作为 serie 加载到 Chartist.js

我认为这将是一个有趣的项目,看看我是否可以从 Google Analytics 获取数据并将其显示在自定义仪表板中,并希望能学到一两件事关于使用 json 和 javascript。

经过大量调试后,我现在设法使用他们的 php api 从 Google Analytics 服务器中提取数据,并将输出保存到服务器上的 data.json 中。

在 data.json 下方,根据 JSONLint.com 有效:

现在我尝试使用 data.json 中的数据并将其输入图表师的标签/系列以绘制图表。

但是我目前不知道为什么这不起作用,X 轴和 Y 轴上的标签正确显示,但没有显示图表。

我尝试使用 .join 来查看是否有所不同,但使用 labelOutput 而不是 labelArray 也不会改变任何东西。

在控制台中,输入chartist的数组对我来说似乎没问题,如果我将它从控制台复制粘贴到脚本中,一切正常。

labelArray 和 seriesArray 的当前输出:

标签数组

系列数组

任何人都知道为什么chartist.js 确实设法沿轴添加正确的标签,但未能读取相同的数据并绘制图表?

0 投票
3 回答
1332 浏览

javascript - Chartist JS,X 轴下的折线图

目前我正在使用 Chartist JS jQuery 插件,我遇到了这个问题,其中一个函数低于 x 轴,即使它没有任何负点。

有没有办法避免这个问题,请检查图像以进一步了解。

在此处输入图像描述

编码

谢谢

0 投票
1 回答
891 浏览

javascript - 将一个居中标签添加到甜甜圈 chartist-js

由于我无法找到并回答这个问题,我希望它不是重复的。我正在使用chartist.js,我制作了一个简单的甜甜圈,这非常简单直接,但现在我想禁用标签,它工作正常并在甜甜圈内添加一个标签(这就是问题)。图表本身不需要标签变大,如果它只是一个新的 div 或其他东西就足够了。

到目前为止我的代码:

我已经尝试使图表本身成为一个 flexbox 并将标签添加为子标签并以这种方式居中,但这不起作用,我尝试用新的 div 包围图表,但让图表消失。

0 投票
8 回答
46468 浏览

javascript - 使用 Chartist.js 如何更改圆环图的笔触颜色?

您好,我正在尝试使用 Chartist.js 创建以下圆环图:

目标图表

这是图表目前的样子:

Chartist.js 圆环图

我正在尝试查找在何处或如何更改此图表的颜色以匹配第一个圆环图。红色和粉红色似乎是默认值。我还没有找到任何关于如何实现这个目标的文档。我还想自定义笔画的大小和图表本身的大小。任何帮助是极大的赞赏!

当前代码:

HTML:

0 投票
1 回答
664 浏览

css - jspm Chartist 不导入 CSS 文件

我在使用 jspm Aurelia 应用程序导入图表库时遇到问题。添加了所有样式,但仍然是奇怪的图表,而不是我正在寻找的颜色和线条。

chartistjs 主页的 app.ts 中的 attach() 方法中包含的代码:

我的 app.html:



我的 Index.cshtml 文件:



我的图表是这样的: 奇怪的图像

但应该是这样的: 参考:https ://gionkunz.github.io/chartist-js/getting-started.html在此处输入图像描述

0 投票
0 回答
461 浏览

arrays - 通过从 json 文件中获取值来创建 Chartist 折线图

我正在尝试通过从 json 文件中获取 x 轴和 y 轴的值来创建折线图,但我无法填充标签和系列,任何人都可以提供任何输入。

示例代码:

示例 json:

0 投票
3 回答
3093 浏览

html - Chartist 图表颜色变化

我正在使用图表师图表,颜色是在框架级别定义的,但我需要为特定图表更改它,所以我无法在框架工作级别进行更改,尝试创建一个 .less 文件,但更改仍然是不反映。

关于如何更改条形图的颜色还有其他选项吗?如果我添加更多条形,颜色应该不同。

PS:chartist 框架更改的链接。 https://github.com/capitalone/Hygieia/tree/master/UI/src/app/chartist

颜色更改需要在 https://github.com/capitalone/Hygieia/blob/master/UI/src/components/widgets/build/build.less中完成

写了一段在 .less 文件中给出的代码,但它没有反映......请输入任何内容。

谢谢