]> git.ipfire.org Git - thirdparty/Chart.js.git/commitdiff
Further improve linear tick collision estimation (#9129)
authorJukka Kurkela <jukka.kurkela@gmail.com>
Thu, 20 May 2021 07:01:47 +0000 (10:01 +0300)
committerGitHub <noreply@github.com>
Thu, 20 May 2021 07:01:47 +0000 (10:01 +0300)
* Further improve linear tick collision estimation

* More tolerance

* Re-create fixtures

* And more tolerance

25 files changed:
src/core/core.scale.js
src/scales/scale.linear.js
src/scales/scale.linearbase.js
test/fixtures/scale.linear/min-max-skip/edge-case-1.js
test/fixtures/scale.linear/min-max-skip/edge-case-1.png
test/fixtures/scale.linear/min-max-skip/edge-case-2.js
test/fixtures/scale.linear/min-max-skip/edge-case-2.png
test/fixtures/scale.linear/min-max-skip/edge-case-3.js
test/fixtures/scale.linear/min-max-skip/edge-case-3.png
test/fixtures/scale.linear/min-max-skip/edge-case-4.js
test/fixtures/scale.linear/min-max-skip/edge-case-4.png
test/fixtures/scale.linear/min-max-skip/rotated-case-1.js
test/fixtures/scale.linear/min-max-skip/rotated-case-1.png
test/fixtures/scale.linear/min-max-skip/rotated-case-2.js
test/fixtures/scale.linear/min-max-skip/rotated-case-2.png
test/fixtures/scale.linear/min-max-skip/rotated-case-3.js
test/fixtures/scale.linear/min-max-skip/rotated-case-3.png
test/fixtures/scale.linear/min-max-skip/rotated-case-4.js
test/fixtures/scale.linear/min-max-skip/rotated-case-4.png
test/fixtures/scale.linear/rotated-45.js [new file with mode: 0644]
test/fixtures/scale.linear/rotated-45.png [new file with mode: 0644]
test/fixtures/scale.linear/rotated-5.js [new file with mode: 0644]
test/fixtures/scale.linear/rotated-5.png [new file with mode: 0644]
test/fixtures/scale.linear/rotated-85.js [new file with mode: 0644]
test/fixtures/scale.linear/rotated-85.png [new file with mode: 0644]

index f5feb9fff77297b00c910efd7ee6d5f394772e3f..8850ad759026b463c00123afca9d8eeca5577771 100644 (file)
@@ -1665,6 +1665,6 @@ export default class Scale extends Element {
   _maxDigits() {
     const me = this;
     const fontSize = me._resolveTickFontOptions(0).lineHeight;
-    return me.isHorizontal() ? me.width / fontSize / 0.7 : me.height / fontSize;
+    return (me.isHorizontal() ? me.width : me.height) / fontSize;
   }
 }
index e9617fb192242dc2ec2e0beaa101cd7e99fa9782..d29772772b8631315c867233ec44664cbc3dd2a2 100644 (file)
@@ -1,6 +1,7 @@
 import {isFinite} from '../helpers/helpers.core';
 import LinearScaleBase from './scale.linearbase';
 import Ticks from '../core/core.ticks';
+import {toRadians} from '../helpers';
 
 export default class LinearScale extends LinearScaleBase {
 
@@ -21,12 +22,12 @@ export default class LinearScale extends LinearScaleBase {
         */
   computeTickLimit() {
     const me = this;
-
-    if (me.isHorizontal()) {
-      return Math.ceil(me.width / 40);
-    }
+    const horizontal = me.isHorizontal();
+    const length = horizontal ? me.width : me.height;
+    const minRotation = toRadians(me.options.ticks.minRotation);
+    const ratio = (horizontal ? Math.sin(minRotation) : Math.cos(minRotation)) || 0.001;
     const tickFont = me._resolveTickFontOptions(0);
-    return Math.ceil(me.height / tickFont.lineHeight);
+    return Math.ceil(length / Math.min(40, tickFont.lineHeight / ratio));
   }
 
   // Utils
index cb299cf43571fcba85f474b55117fff88b3a08e7..ab2c4b91e5cd4f2de880190a7cc69068d96cea5f 100644 (file)
@@ -36,7 +36,7 @@ function generateTicks(generationOptions, dataRange) {
   const minDefined = !isNullOrUndef(min);
   const maxDefined = !isNullOrUndef(max);
   const countDefined = !isNullOrUndef(count);
-  const minSpacing = (rmax - rmin) / maxDigits;
+  const minSpacing = (rmax - rmin) / (maxDigits + 1);
   let spacing = niceNum((rmax - rmin) / maxSpaces / unit) * unit;
   let factor, niceMin, niceMax, numSpaces;
 
@@ -135,12 +135,10 @@ function generateTicks(generationOptions, dataRange) {
 }
 
 function relativeLabelSize(value, minSpacing, {horizontal, minRotation}) {
-  const rot = toRadians(minRotation);
-  const useLength = (horizontal && minRotation <= 45) || (!horizontal && minRotation >= 45);
-  const l = useLength ? minSpacing * ('' + value).length : 0;
-  const sin = Math.sin(rot);
-  const cos = Math.cos(rot);
-  return horizontal ? cos * l + sin * minSpacing : sin * l + cos * minSpacing;
+  const rad = toRadians(minRotation);
+  const ratio = (horizontal ? Math.sin(rad) : Math.cos(rad)) || 0.001;
+  const length = 0.75 * minSpacing * ('' + value).length;
+  return Math.min(minSpacing / ratio, length);
 }
 
 export default class LinearScaleBase extends Scale {
index 89a6dd883beaff1e932f164e6c674928b2a9e47b..ba0d1bedafaf49319d9138cdab89f5239b1b0f56 100644 (file)
@@ -24,8 +24,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 211,
-      width: 408
+      height: 196,
+      width: 407
     }
   }
 };
index 9401c0eb477cacdcc064dedf91a51bdd1f19a822..11cb4899682c982aaceac77830bbce98cf89fbab 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/edge-case-1.png and b/test/fixtures/scale.linear/min-max-skip/edge-case-1.png differ
index 8325a4d68052e3ebe3e337e50bf185e325b51689..b99037e14c1aeb50881717faf5867c5b6d147317 100644 (file)
@@ -24,8 +24,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 212,
-      width: 409
+      height: 197,
+      width: 420
     }
   }
 };
index f2f878f8946d9046c645b17a529b80ba62e4e147..b49359b0ccf7dea9c48aa91d9b190e5e63576c57 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/edge-case-2.png and b/test/fixtures/scale.linear/min-max-skip/edge-case-2.png differ
index eca5a110fdf5af0725b5834677396055412f30a3..6b0d03aa9aa7d9bd8eddca3ff850e45cea7fbfb6 100644 (file)
@@ -24,8 +24,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 213,
-      width: 536
+      height: 199,
+      width: 556
     }
   }
 };
index 55cc3cbdbb13b04b9757ed02b13afc9b05759d7b..bb9b350f466039b8fca9169a64f4302371b96a41 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/edge-case-3.png and b/test/fixtures/scale.linear/min-max-skip/edge-case-3.png differ
index 3993e379883aa2cb242a25297acc79aa70c24f5e..2ff7b8b7313e0bffb974b90a897436771f0ed50a 100644 (file)
@@ -24,8 +24,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 214,
-      width: 537
+      height: 200,
+      width: 557
     }
   }
 };
index 2f7f6276b352adbd41b8b37acb04be0cb5befc83..9106a49f8dd78f3a9659cf1c48ee0319d56474c8 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/edge-case-4.png and b/test/fixtures/scale.linear/min-max-skip/edge-case-4.png differ
index bc9d26e98d0e72f726f2a25683af5f39c3268418..cbc8999b21c5c80c3e6e7c5d977b69dd7102a428 100644 (file)
@@ -1,6 +1,6 @@
 module.exports = {
   description: 'https://github.com/chartjs/Chart.js/issues/9025',
-  threshold: 0.15,
+  threshold: 0.2,
   config: {
     type: 'scatter',
     options: {
@@ -18,7 +18,7 @@ module.exports = {
           min: 230,
           ticks: {
             autoSkip: false,
-            minRotation: 35
+            minRotation: 67.5
           }
         }
       }
@@ -27,8 +27,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 211,
-      width: 415
+      height: 231,
+      width: 221
     }
   }
 };
index c23af54932ccb28208ee97ef738c81aa788ac11c..358ef01720eae4387cbbde6be1da0f937ee8d600 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/rotated-case-1.png and b/test/fixtures/scale.linear/min-max-skip/rotated-case-1.png differ
index 7179518a7033eead4fca9c6f20717f71f8b4c989..5f1fbb8d9cb50d493fbaafb9aecbcea4c12fc766 100644 (file)
@@ -1,6 +1,6 @@
 module.exports = {
   description: 'https://github.com/chartjs/Chart.js/issues/9025',
-  threshold: 0.15,
+  threshold: 0.2,
   config: {
     type: 'scatter',
     options: {
@@ -18,7 +18,7 @@ module.exports = {
           min: 230,
           ticks: {
             autoSkip: false,
-            minRotation: 35
+            minRotation: 67.5
           }
         }
       }
@@ -27,8 +27,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 214,
-      width: 416
+      height: 232,
+      width: 222
     }
   }
 };
index 335a03b4d1bbcfbc66a67e809792f5fc871f0f59..ef7e97d901e8f8921e40b437634a41abc7cfe4c2 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/rotated-case-2.png and b/test/fixtures/scale.linear/min-max-skip/rotated-case-2.png differ
index 22d8426e3b0b0881f07ca32f9388c55f9b1e138b..71fb0e70495478341c8bab1e38760bdf70345763 100644 (file)
@@ -1,6 +1,6 @@
 module.exports = {
   description: 'https://github.com/chartjs/Chart.js/issues/9025',
-  threshold: 0.15,
+  threshold: 0.2,
   config: {
     type: 'scatter',
     options: {
@@ -18,7 +18,7 @@ module.exports = {
           min: 230,
           ticks: {
             autoSkip: false,
-            minRotation: 35
+            minRotation: 67.5
           }
         }
       }
@@ -27,8 +27,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 216,
-      width: 520
+      height: 234,
+      width: 224
     }
   }
 };
index 790f5525efe2db139223ab811358a1aa9a183446..a6c31dfaf04e018b4832a1d8b32cbf718bc35ea2 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/rotated-case-3.png and b/test/fixtures/scale.linear/min-max-skip/rotated-case-3.png differ
index 6da47127af0d0444dc43bab0935c97beb3aba71e..c639b3c5bdbb6835709901524118f2ca5e06761e 100644 (file)
@@ -1,6 +1,6 @@
 module.exports = {
   description: 'https://github.com/chartjs/Chart.js/issues/9025',
-  threshold: 0.15,
+  threshold: 0.2,
   config: {
     type: 'scatter',
     options: {
@@ -18,7 +18,7 @@ module.exports = {
           min: 230,
           ticks: {
             autoSkip: false,
-            minRotation: 35
+            minRotation: 67.5
           }
         }
       }
@@ -27,8 +27,8 @@ module.exports = {
   options: {
     spriteText: true,
     canvas: {
-      height: 217,
-      width: 521
+      height: 235,
+      width: 225
     }
   }
 };
index df57d4f918274d76010630acf6b74b4f1a453ca8..9bdae09e50cf6ae1e7618125dbfed036cbab1c22 100644 (file)
Binary files a/test/fixtures/scale.linear/min-max-skip/rotated-case-4.png and b/test/fixtures/scale.linear/min-max-skip/rotated-case-4.png differ
diff --git a/test/fixtures/scale.linear/rotated-45.js b/test/fixtures/scale.linear/rotated-45.js
new file mode 100644 (file)
index 0000000..7d9060f
--- /dev/null
@@ -0,0 +1,38 @@
+module.exports = {
+  description: 'https://github.com/chartjs/Chart.js/issues/9025',
+  threshold: 0.2,
+  config: {
+    type: 'scatter',
+    options: {
+      scales: {
+        y: {
+          min: 1612781975085.5466,
+          max: 1620287255085.5466,
+          ticks: {
+            autoSkip: false,
+            minRotation: 45,
+            maxRotation: 45,
+            count: 13
+          }
+        },
+        x: {
+          min: 1612781975085.5466,
+          max: 1620287255085.5466,
+          ticks: {
+            autoSkip: false,
+            minRotation: 45,
+            maxRotation: 45,
+            count: 13
+          }
+        }
+      }
+    }
+  },
+  options: {
+    spriteText: true,
+    canvas: {
+      height: 350,
+      width: 350
+    }
+  }
+};
diff --git a/test/fixtures/scale.linear/rotated-45.png b/test/fixtures/scale.linear/rotated-45.png
new file mode 100644 (file)
index 0000000..dc5e19d
Binary files /dev/null and b/test/fixtures/scale.linear/rotated-45.png differ
diff --git a/test/fixtures/scale.linear/rotated-5.js b/test/fixtures/scale.linear/rotated-5.js
new file mode 100644 (file)
index 0000000..0f65481
--- /dev/null
@@ -0,0 +1,34 @@
+module.exports = {
+  description: 'https://github.com/chartjs/Chart.js/issues/9025',
+  threshold: 0.2,
+  config: {
+    type: 'scatter',
+    options: {
+      scales: {
+        y: {
+          min: 0,
+          max: 500000,
+          ticks: {
+            minRotation: 5,
+            maxRotation: 5,
+          }
+        },
+        x: {
+          min: 0,
+          max: 500000,
+          ticks: {
+            minRotation: 5,
+            maxRotation: 5,
+          }
+        }
+      }
+    }
+  },
+  options: {
+    spriteText: true,
+    canvas: {
+      height: 350,
+      width: 350
+    }
+  }
+};
diff --git a/test/fixtures/scale.linear/rotated-5.png b/test/fixtures/scale.linear/rotated-5.png
new file mode 100644 (file)
index 0000000..64b9fcf
Binary files /dev/null and b/test/fixtures/scale.linear/rotated-5.png differ
diff --git a/test/fixtures/scale.linear/rotated-85.js b/test/fixtures/scale.linear/rotated-85.js
new file mode 100644 (file)
index 0000000..d367bea
--- /dev/null
@@ -0,0 +1,34 @@
+module.exports = {
+  description: 'https://github.com/chartjs/Chart.js/issues/9025',
+  threshold: 0.2,
+  config: {
+    type: 'scatter',
+    options: {
+      scales: {
+        y: {
+          min: 0,
+          max: 500000,
+          ticks: {
+            minRotation: 85,
+            maxRotation: 85,
+          }
+        },
+        x: {
+          min: 0,
+          max: 500000,
+          ticks: {
+            minRotation: 85,
+            maxRotation: 85,
+          }
+        }
+      }
+    }
+  },
+  options: {
+    spriteText: true,
+    canvas: {
+      height: 350,
+      width: 350
+    }
+  }
+};
diff --git a/test/fixtures/scale.linear/rotated-85.png b/test/fixtures/scale.linear/rotated-85.png
new file mode 100644 (file)
index 0000000..edf09fa
Binary files /dev/null and b/test/fixtures/scale.linear/rotated-85.png differ