notion-inline-math-equations

Render Latex in notion

  1. // ==UserScript==
  2. // @name notion-inline-math-equations
  3. // @namespace https://github.com/ghosw/notion-inline-math-equations
  4. // @match https://www.notion.so/*
  5. // @version 0.0.2
  6. // @description Render Latex in notion
  7. // @require https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/katex.min.js
  8. // @require https://cdn.jsdelivr.net/npm/katex@0.11.1/dist/contrib/auto-render.min.js
  9. // @grant GM_addStyle
  10. // ==/UserScript==
  11.  
  12. // Acknowledgement
  13. // This script was inspired by: https://github.com/evertheylen/notion-inline-math & https://github.com/Penguinlay/notion-inline-latex
  14.  
  15. // right-padding for inline math mode
  16. GM_addStyle(`
  17. .katex {
  18. padding-right: 0 !important;
  19. }
  20. `);
  21.  
  22. let timeBetweenRenders = 500;
  23.  
  24. function htmlToElement(str) {
  25. var template = document.createElement('template');
  26. str = str.trim(); // Never return a text node of whitespace as the result
  27. template.innerHTML = str;
  28. return template.content.firstChild;
  29. }
  30.  
  31. // render inline LaTeX
  32. function renderInlineLaTeX() {
  33. activeEl = document.activeElement;
  34. activeEl.classList.add('do-not-render-katex-123456789');
  35. let el = document.getElementsByClassName("notion-page-content")[0];
  36. if (!el) {
  37. return;
  38. }
  39.  
  40. renderMathInElement(el, {
  41. delimiters: [
  42. // LaTeX delimiters (uncomment/add as needed)
  43. { left: "$$" , right: "$$" , display: true },
  44. // { left: "\\[", right: "\\]", display: true },
  45. // { left: "\\(", right: "\\)", display: false },
  46. { left: "$", right: "$", display: false }
  47. ],
  48. ignoredClasses: ['do-not-render-katex-123456789']
  49. });
  50. activeEl.classList.remove('do-not-render-katex-123456789');
  51. }
  52.  
  53. katexLink = htmlToElement('<link href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.11.1/katex.min.css" type="text/css" rel="stylesheet">');
  54. document.head.appendChild(katexLink);
  55. setInterval(renderInlineLaTeX, timeBetweenRenders);

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址