草庐IT

chartjs-2.6.0

全部标签

javascript - react-chartjs 饼图不呈现

我复制了react-chartjs文件夹并执行了以下操作:在顶部是否需要react-chartjs/pie库。我没有看到任何控制台错误,但未呈现我的饼图。我什至尝试将所有提到的选项都放在这里。varPieChart=require('../../components/react-chartjs/pie');varMyComponent=React.createClass({render:function(){varpieOptions={animatable:true,};varpieData=[{value:300,color:"#F7464A",highlight:"#FF5A5E

javascript - ChartJS 圆环图渐变填充

所以我尝试为ChartJS圆环图制作渐变填充,但这只能在水平方向上使用,而不是在圆形中使用。这是我正在使用的代码:varctx=document.getElementById("chart-area").getContext("2d");vargradient1=ctx.createLinearGradient(0,0,0,175);gradient1.addColorStop(0.0,'#ACE1DB');gradient1.addColorStop(1.0,'#7FBDB9');vargradient2=ctx.createLinearGradient(0,0,400,400);g

javascript - 使用 ChartJS 单击更改点颜色

目前,我可以在单击某个点(折线图)时更改它的颜色,但它会立即变回以前的颜色,我该如何防止这种情况发生?这是我的功能:varoptions={onClick:function(e){varelement=this.getElementAtEvent(e);if(element.length>0){element[0]._view.backgroundColor='#FFF';this.update();}}我在这里发现了同样的问题https://github.com/chartjs/Chart.js/issues/2989显然这个人能够管理它,但我认为该代码不再兼容。我正在使用Chart

javascript - ChartJS——有没有办法去除饼图周围的空白区域?

我正在处理一个图表,该图表在左侧和右侧有不需要的间距。我一直试图在没有运气的情况下删除它,我不知道现在还能做什么。我已经仔细阅读了文档,但似乎找不到解决方案。这可能吗?如果需要更多信息,请告诉我,我会提供。编辑:vargender_data=[10,35];vargraph_gender_preset={labels:["Female","Male"],datasets:[{data:gender_data,backgroundColor:["#0fa0e3","#ff3549"]}]};varctx3=$("#chart-gender");varchart_gender=newCha

javascript - Chartjs 雷达索引标签

我正在使用chartjs绘制雷达图。该值显示在悬停在图表的点上,但我想始终显示该值。我需要更改View以在打印页面时显示数据。这是我当前的图表。悬停时显示标签我想一直显示值,如下图所示 最佳答案 以下答案仅适用于Chart.jsv2。如果您想要v1解决方案,请检查pritishvaidya's.您想使用图表选项的animation属性:options:{animation:{duration:500,onComplete:function(){//Thecodeherewillbeexecutedattheendoftheanima

javascript - 带有 AngularJS 的 ChartJS - Canvas 不会显示任何内容

我正在尝试使用angular-chartjs图书馆,但遇到了一些问题。页面上没有错误。但是Canvas是空的。有人有想法吗?我试过几次重新排序脚本。我只是想不通。:(这是html。这是应用初始化:varapp=angular.module('profitly',['ngRoute','chartjs']);这是这部分的Controller:app.controller('graph',function($scope){$scope.someData={labels:['Supply','May','Jun'],datasets:[{data:[1,7,15,19,31,40]},{da

javascript - ChartJs 折线图在悬停时重新绘制故障

我有以下代码利用ChartJS库。/*assumethetagsintherightplace*/varctx=$("#graph1").get(0).getContext("2d");varmyChart=newChart(ctx).Line(graph1Generator("day"));...一切正常,但在添加以下事件处理程序以使用不同数据清除和重新绘制相同图表后,出现故障。weekButton.addEventListener("click",function(){ctx.clearRect(0,0,300,300);ctx.canvas.width=300;ctx.canva

javascript - ChartJS 将工具提示添加到分组条形图

我正在尝试使用ChartJS将欧元符号添加到我的分组条形图的工具提示中。剪断:tooltips:{mode:'label',callbacks:{label:function(tooltipItem,data){returndata['datasets'][0]['data'][tooltipItem['index']]+'€';}}}此代码适用于我的折线图,但不适用于我的分组条形图。我希望我的条形图在悬停时如下所示:但是我的图表中没有欧元符号,它只是显示它的值。我做错了什么?谢谢。**编辑所以我的完整选项如下所示:options:{title:{display:true,text:'

javascript - ChartJS – 如何在空饼图上显示边框?

我有几个使用ChartJS显示的饼图/圆环图。通常,它们包含[200,1200,300]和[30,500]之类的数据以给出估计值,但在极少数情况下,它们会包含[0,0,0]和[0,0]。那么问题是图表消失了,即使我启用了边框。我已通过向数组中的第一个元素添加虚拟值来解决此问题,但我不喜欢代码的外观并想要更好的方法。当数组只包含零时,是否可以使边框可见(一个圆圈)?编辑:我似乎没有得到这个问题的任何答案。当边框未显示在空数据上时,它是否被视为错误,或者这是预期的行为?不知道有没有其他人遇到过这个问题。我仍然需要找到一种优雅的方式来处理这个问题,但我还没有找到。

javascript - 如何在 Chartjs 中制作整数刻度

我正在尝试制作一个整数刻度的水平条形图。正如thisquestion中的建议,我尝试设置scaleOverride、scaleSteps等,但它似乎不起作用。我尝试将它们放入数据集、选项、xScales中,但没有任何效果。Thisjsfiddle显示了我尝试做的事情。 最佳答案 链接的问题是针对Chart.js1.x版的。对于新版本,您需要使用ticks选项。参见http://www.chartjs.org/docs/#scales...xAxes:[{ticks:{min:0,stepSize:1,max:4},...fiddle