chart.js

Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis

由 时光怂恿深爱的人放手 提交于 2020-01-31 03:37:06
问题 I've started using the latest beta of v2 of chart.js since I need to draw a chart that contains both a stacked bar chart and an unstacked line chart on the same chart. Here's an example of what I need: In this chart the lines are not stacked and are all showing their natural values but the bar chart is stacked and shows the combined total of the values (including some negative values). I've managed to get the two charts drawn together but so far I've only succeeded in either having both

Chartjs 2 - Stacked bar and unstacked line on same chart with same y axis

由 只愿长相守 提交于 2020-01-31 03:37:05
问题 I've started using the latest beta of v2 of chart.js since I need to draw a chart that contains both a stacked bar chart and an unstacked line chart on the same chart. Here's an example of what I need: In this chart the lines are not stacked and are all showing their natural values but the bar chart is stacked and shows the combined total of the values (including some negative values). I've managed to get the two charts drawn together but so far I've only succeeded in either having both

Automatic colors assignment in chart.js 2.x doesn't work anymore, used to work in v. 1.x

由 放肆的年华 提交于 2020-01-30 14:30:09
问题 Using Chart.js 1.x I could create a pie chart and get the colors automatically assigned: <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/1.1.1/Chart.js"></script> <body> <canvas id="myChart" width="400" height="400"></canvas> <script> var ctx = document.getElementById("myChart").getContext("2d"); var data = [{"label":"Conservative","value":"5"},{"label":"Democratic","value":"6"}]; var myChart = new Chart(ctx).Pie(data); </script> </body> if I do the same with v 2.x <script src=

Chart.js Picture inside doughnut segment

由 你。 提交于 2020-01-30 10:56:09
问题 I found out about chart.js and I am looking to use a doughnut chart for my website, I found a example where I can take the basics from : https://jsfiddle.net/9wp4f693/2/ I've only found something like this, but it was to draw text inside the segments, not to add pictures. function drawSegmentValues() { for(var i=0; i<myDoughnutChart.segments.length; i++) { ctx.fillStyle="white"; var textSize = myChart.width/10; ctx.font= textSize+"px Verdana"; // Get needed variables var value =

Chart.js Picture inside doughnut segment

由 扶醉桌前 提交于 2020-01-30 10:56:07
问题 I found out about chart.js and I am looking to use a doughnut chart for my website, I found a example where I can take the basics from : https://jsfiddle.net/9wp4f693/2/ I've only found something like this, but it was to draw text inside the segments, not to add pictures. function drawSegmentValues() { for(var i=0; i<myDoughnutChart.segments.length; i++) { ctx.fillStyle="white"; var textSize = myChart.width/10; ctx.font= textSize+"px Verdana"; // Get needed variables var value =

Edit tooltips in ChartJS

由 帅比萌擦擦* 提交于 2020-01-30 08:21:29
问题 I have some troubles with customization of chartjs tooltips. var animationComplete = function () { var self = this; Chart.helpers.each(self.datasets[0].points, function (point, index) { Chart.helpers.each(self.datasets, function (dataset) { new Chart.MultiTooltip({ x: point.x, y: dataset.points[index].y, xPadding: self.options.tooltipXPadding, yPadding: self.options.tooltipYPadding, xOffset: self.options.tooltipXOffset, //yOffset: self.options.tooltipYOffset, fillColor: self.options

Change color of measure unit with Chart.js

由 本秂侑毒 提交于 2020-01-25 09:03:09
问题 I'm using Chart.js to create a bar chart. Behind the cart there is a dark green background so it's hard to see the numbers in black that are displayed on y and x axys. This is how I generate my chart: document.getElementsByClassName("home-message")[0].innerHTML='<canvas id="myChart" width="400" height="400"></canvas>' var ctx = document.getElementById('myChart').getContext('2d'); var myChart = new Chart(ctx, { type: 'bar', color: 'white', data: { labels: ['Bar', 'Mensa', 'Ingresso'], datasets

Chart.js　How to synchronize pan and zoom in multiple chats

由 爱⌒轻易说出口 提交于 2020-01-25 08:22:07
问题 I want to synchronize pan and zoom on multiple charts. I'm been using Chart.js with chartjs-plugin-zoom. charjs-plugin-zoom calls an event with the onZoom callback function. So, the values ​​at both ends of the X axis are obtained in this way with the callback function. onZoom: function () { var minVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[0].time; var maxVal = myChartA.getDatasetMeta(0).dataset._scale.chart.scales['x-axis-0']._table[1].time; leftEnd =

Slice values are getting wiped out after refreshing Pie chart

由 无人久伴 提交于 2020-01-25 06:39:09
问题 I am using below code to populate slice values in a pie chart using JS and it's correctly working but I am observing another problem as these values are getting populated only once and when I reload the charts it's getting disappeared. Now let's say if I close the browser and open again or change the browser it will show values again. But after doing multiple force refresh Ctrl + F5 then also it's not showing the values. Could you please help? Please note I am having more than 3 pie charts on

Horizontal scroll in vue-chartjs

由 孤人 提交于 2020-01-25 02:36:06
问题 I have a question about vue-chartjs. I need to achieve a result like this one in jsfiddle: http://jsfiddle.net/mbhavfwm/ Here is my vuejs component's code (Chart data is sent by params). <script> import { Line, mixins } from 'vue-chartjs' import zoom from 'chartjs-plugin-zoom'; const { reactiveProp } = mixins; export default { extends: Line, mixins: [reactiveProp], data () { return { options: { scales: { yAxes: [{ ticks: { beginAtZero: true }, gridLines: { display: true } }], xAxes: [ {
订阅 chart.js