Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

BUG: Graph is stick out when set min or max options to yAxes. #3506

Closed
skjune12 opened this issue Oct 23, 2016 · 1 comment
Closed

BUG: Graph is stick out when set min or max options to yAxes. #3506

skjune12 opened this issue Oct 23, 2016 · 1 comment

Comments

@skjune12
Copy link

skjune12 commented Oct 23, 2016

Hello. When I set min (or max) parameter to yAxes options in line chart, data which less than min value (or greater than max value) is sticked out from drawing area, and labels are overlayed with lines. It also occurs in bar chart.

I know when I set suggestedMin options to yAxes, y-axis labels are auto-scaled. But I want to hide data less than specified value. Is that a bug or can I get any solutions?

Expected Behavior

Values less than min or greater than max value are not displayed from drawing area, and labels are not overlayed with data.

Current Behavior

Steps to Reproduce (for bugs)

  1. set max and min options to yAxis.
  2. generate datasets which includes values greater than max value or less than min value.

Environment

@etimberg
Copy link
Member

Thanks for the detailed report. You can add some basic clipping by adding the following plugin to your chart

Chart.plugins.register({
  beforeDatasetsDraw: function(chartInstance) {
    var ctx = chartInstance.chart.ctx;
    var chartArea = chartInstance.chartArea;
    ctx.save();
    ctx.beginPath();
    ctx.rect(chartArea.left, chartArea.top, chartArea.right - chartArea.left, chartArea.bottom - chartArea.top);
    ctx.clip();
  },
  afterDatasetsDraw: function(chartInstance) {
    chartInstance.chart.ctx.restore();
  },
});

Closing as duplicate of #3491 and #2870

This was referenced Nov 27, 2016
etimberg pushed a commit that referenced this issue Dec 3, 2016
Implements clipping of items outside the chart area. Resolves #3506 #3491 #2873
exwm pushed a commit to exwm/Chart.js that referenced this issue Apr 30, 2021
Implements clipping of items outside the chart area. Resolves chartjs#3506 chartjs#3491 chartjs#2873
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants