2013-09-29 28 views
7

Sto sperimentando con il controllo JavaFX WebView e voglio utilizzare la libreria Javascript MathJax per il rendering di contenuto matematico.JavaFX WebView carica file Javascript locale

Come prova ho creato un progetto di base JavaFX FXML, aggiunto un WebView al FXML e aggiornato il codice di controllo in questo modo:

public class SampleController implements Initializable { 

    @FXML 
    private WebView webView; 

    @Override 
    public void initialize(URL url, ResourceBundle rb) { 
     webView.getEngine().load(
      "file:///Users/benjamin/Desktop/Page.html"); 
    } 
} 

il file HTML si presenta così:

<!DOCTYPE html> 
<html> 
    <head> 
     <title></title> 
     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 

     <script type="text/x-mathjax-config"> 
      MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}}); 
     </script> 
     <script type="text/javascript" 
       src="/Users/benjamin/Downloads/mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"> 
     </script> 
    </head> 
    <body> 
     When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are 
     $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$ 
    </body> 
</html> 

Funziona come previsto e produce il seguente risultato:

enter image description here

Si noti che per il test, i percorsi dei file html e JavaScript sono codificati in modo rigido per le posizioni sul mio disco rigido, quindi il passaggio successivo è di impacchettare l'html come una risorsa che è in bundle con l'applicazione in modo che non stia cercando file locali.

Ho aggiornato il codice del controller per cercare la pagina come questa (l'html non è stato modificato).

@Override 
public void initialize(URL url, ResourceBundle rb) { 
    webView.getEngine().load(
     this.getClass().getResource("Page.html").toExternalForm()); 
} 

ma questo produce il seguente risultato:

enter image description here

Come si può vedere, il contenuto matematico non è più resa.

Se cambio il tag html <script> per fare riferimento al codice JavaScript da un CDN, allora tutto funziona come nell'esempio originale ma mi piacerebbe poter fare riferimento al file JavaScript locale (e infine una versione che è in bundle con il applicazione).

È ciò che sto cercando di ottenere possibile?

risposta

7

Aggiungi file per lo stesso pacchetto i MathJax.js/cartella page.html poi riferimento ad essa come

<script type="text/javascript" 
     src="MathJax.js?config=TeX-AMS-MML_HTMLorMML"> 
</script> 
Problemi correlati