chartjs

laravel-admin 添加图表 Chartjs

由 情到浓时终转凉″ 提交于 2019-12-06 10:14:16
github地址： https://github.com/laravel-admin-extensions/chartjs Installation composer require laravel-admin-ext/chartjs php artisan vendor:publish --tag=laravel-admin-chartjs onfiguration Open config/admin.php , add configurations that belong to this extension at extensions section. 'extensions' => [ 'chartjs' => [ // Set to `false` if you want to disable this extension 'enable' => true, ] ] Usage Create a view in views directory like resources/views/admin/chartjs.blade.php , and add following codes: <canvas id="myChart" width="400" height="400"></canvas> <script> $(function () { var ctx =

ChartJS - Donut charts with multiple rings

由 匿名 (未验证) 提交于 2019-12-03 08:54:24
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: Is it possible to create a donut chart with multiple rings using ChartJS as shown below? 回答1: You can find out the solution at fiddle link var ctx = document.getElementById("chart-area").getContext("2d"); var myDoughnut = new Chart(ctx, config); var config = { type: 'doughnut', data: { datasets: [{ data: [ 10,20,30 ], backgroundColor: [ "#F7464A", "#46BFBD", "#FDB45C" ], }, { data: [ randomScalingFactor(), randomScalingFactor(), randomScalingFactor() ], backgroundColor: [ "#F7464A", "#46BFBD", "#FDB45C" ], }], labels: [ "Red", "Green",

How to modify bar width in Chartjs 2 bar charts

由 匿名 (未验证) 提交于 2019-12-03 08:44:33
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: Can someone told me how to modify bar width in Chartjs 2 bar charts. There is nothing about it in the documentation. https://github.com/nnnick/Chart.js/tree/v2.0-dev/docsI don't know what to do. 回答1: Note that there seems to be some changes going on. The actual configuration would depend on which v2.0 you are using. For Version 2.0.0-alpha Set categorySpacing for the xAxes. You can do this globally Chart.defaults.bar.scales.xAxes[0].categorySpacing = 0 or you can do it by chart ... scales: { xAxes: [{ categorySpacing: 0 }], ... Fiddle - http

How to set ChartJS Y axis title?

由 匿名 (未验证) 提交于 2019-12-03 03:04:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I am using Chartjs for showing diagrams and I need to set title of y axis, but there are no information about it in documentation. I need y axis to be set like on picture, or on top of y axis so someone could now what is that parameter I have looked on official website but there was no information about it 回答1: You can tweak the options and extend the chart type to do this, like so Chart.types.Line.extend({ name: "LineAlt", draw: function () { Chart.types.Line.prototype.draw.apply(this, arguments); var ctx = this.chart.ctx; ctx.save(); //

ChartJS : How to set max and min value for Y axis

由 匿名 (未验证) 提交于 2019-12-03 02:56:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 由 翻译 强力驱动 问题: I am using line chart from http://www.chartjs.org/ As you can see max value (130) and min value (60) for Y axis are chosen automatically , I want max value = 500 and min value=0. Is this possible? 回答1: You have to overrride the scale, try this: window . onload = function (){ var ctx = document . getElementById ( "canvas" ). getContext ( "2d" ); window . myLine = new Chart ( ctx ). Line ( lineChartData , { scaleOverride : true , scaleSteps : 10 , scaleStepWidth : 50 , scaleStartValue : 0 }); } 回答2: For chart.js V2 (beta), use: var

How to disable chartjs legendclick

由 匿名 (未验证) 提交于 2019-12-03 02:30:02
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I would like to disable chart.js Spider chart legend click because when I click on the legend the data series is hiding the associated set of values as shown in the below images. My requirement is that I do not want to disable the dataset. I have tried the preventDefault(); on the chart click but it is not working. My code sample is attached below. Please check.. <!doctype html> <html> <head> <title>Radar Chart</title> <script src="../dist/Chart.bundle.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min

Custom Legend with ChartJS v2.0

由 匿名 (未验证) 提交于 2019-12-03 01:25:01
可以将文章内容翻译成中文,广告屏蔽插件可能会导致该功能失效(如失效，请关闭广告屏蔽插件后再试): 问题: I'm trying to create a custom legend template in ChartJS v2.0. In v1* of ChartJS I simply added a property to the new Chart constructor such as... legendTemplate : ' ' +'' +' ' +' \"> ' +'' +' ' +'' +' ' I can't seem to find any documentation in v2.0 for this option. Is it even available anymore? Can anyone show an example of how to accomplish this? Thank you! Update - Working code below legendCallback: function(chart) { console.log(chart.data); var text = []; text.push(' '); for (var i=0; i '); text.push(' ' + chart.data.datasets[0].data[i]
订阅 chartjs