How do I use KaTex from a CDN in my project?

Post reply
0 favourites
  • 2 posts
From the Asset Store
Archer Project
$49 USD
With this template you can create your own archer game and customize it however you want.
S7Games's avatar
S7Games

  • I want to create math equations with Katex in my project. Any help you can provide would be appreciated.

    KaTex with the CDN link->https://katex.org/docs/browser.html

    I have read this forum post (and many others) ->https://www.construct.net/en/forum/construct-3/general-discussion-7/latex-text-editor-c3-145256

    I have addons CSS and HTML Element both by Strani Anelli el3um4s

    Here is main.js that is in Scripts folder. 

    // Import any other script files here, e.g.:
// import * as myModule from "./mymodule.js";

runOnStartup(async runtime =>
{
	// Code to run on the loading screen.
	// Note layouts, objects etc. are not yet available.
	
	runtime.addEventListener("beforeprojectstart", () => OnBeforeProjectStart(runtime));
	runtime.addEventListener("beforeprojectstart", () => LoadExternalScript(runtime));
});

async function LoadExternalScript(runtime)
{
	await runtime.assets.loadScripts("https://cdn.jsdelivr.net/npm/katex@0.13.11/dist/katex.min.js");
}

async function OnBeforeProjectStart(runtime)
{
	// Code to run just before 'On start of layout' on
	// the first layout. Loading has finished and initial
	// instances are created and available to use here.
	
	runtime.addEventListener("tick", () => Tick(runtime));
}

function Tick(runtime)
{
	// Code to run every tick
}

    Tagged:

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads

  • I've been randomly trying different things and I somewhat got this to work.

    First off, I went to MathJax and LaTex instead of KaTex. I also used the example code for that C3 LaTeX thread.

    main.js is standard except for this line 

    import * as MathJax from "./load-mathjax.js";

    I can get LaTex to render right the first time I provide the CDN link. It won't work after that unless I change the CND link again. Is there some kind of a Cashe or some other one time only run setting?

    load-mathjax.js 

    window.MathJax = {
 tex: {
 inlineMath: [['$', '$'], ['\\(', '\\)']]
 },
 svg: {
 fontCache: 'global'
 }
};

(function () {
 var script = document.createElement('script');
 script.src = 'https://cdn.jsdelivr.net/npm/mathjax@3.1.4/es5/tex-chtml-full.js';
 script.async = true;
 document.head.appendChild(script);
})();

// script.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.5/MathJax.js?config=TeX-MML-AM_CHTML';
Post reply
  • 2 posts
Return to board index
Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)