Qualcuno ha ottenuto processing.js lavorando in IE?

Question

Sto cercando esempi di processing.js che funzionano in Internet Explorer tramite ExplorerCanvas o simili.

Answer 1

Il sparklines example nella pagina processing.js exhibition utilizza ExplorerCanvas. Sembra che sia solo una soluzione drop-in, non è necessaria alcuna codifica aggiuntiva.

Answer 2

This page descrive come ottenere processing.js + excanvas che lavorano insieme.

Fondamentalmente implica la scrittura del proprio metodo onload init che IE può comprendere.

Answer 3

Si può fare! Tuttavia, ci sono alcuni trucchi. The page htxt links to va bene, per quanto va, ma si noti quanto segue:

1) Entrambi gli elementi di script e canvas devono avere attributi id. La funzione init usa questi id di attributo per associare uno script dato ad un dato canvas. Ho trovato la funzione di init semplificata più facile da capire rispetto a quella ufficiale. Dovrai padroneggiare quello ufficiale se hai più tele su una pagina.

2) Se si utilizzano le designazioni di colore in stile Internet, come # 23ff9a, fare attenzione! IE 8 vuole tutti i maiuscoli esadecimali numeri di colore da Processing.js/canvas. Scrivi # 23FF9A! Questo è ciò che mostra la documentazione, quindi non dovrebbe essere una sorpresa completa. L'errore è qualcosa che a volte fa impazzire. Per lo più, i numeri più grandi (per i colori più chiari) con molte f sembrano essere afflitti. Bianco, #ffffff, va bene, ma # ff00ff non lo è. Firefox e Safari non fanno distinzione tra maiuscole e minuscole a questo proposito. Il documentation dice che è possibile utilizzare una notazione esadecimale alternativa con canale alfa (il CC) che assomiglia a 0xCC006699. Questo non ha funzionato per me; forse è sulla lista delle cose da fare.

3) Manca il metodo .equals() sulle stringhe! Andor Salga, una delle crew del Seneca College che lavora su Processing.js, ha scritto una semplice funzione boolean stringheEqual (str1, str2) che è possibile vedere here. Ciò avverrà fino a quando la questione non sarà definitivamente risolta.

4) Non è vero che stroke() non funziona con excanvas.js. Lo fa. Tuttavia, se il tuo codice Processing.js ha anche un piccolo errore di sintassi (non riesco a classificare realmente i tipi, ma cercherò di usare .equals() lo farà) la tua routine probabilmente fallirà silenziosamente in IE8, mentre, in Safari o Firefox, i tuoi rettangoli potrebbero perdere i loro contorni, per esempio stroke() smetterà di funzionare. IE su Vista e Safari su Mac hanno entrambi dimostrato un controllo più accurato della sintassi rispetto a Safari o Firefox su Vista, che soffieranno alcuni errori e renderanno un'immagine difettosa.

5) Testo, richiamato utilizzando la funzione text(), esegue il rendering in Firefox (in un font non modificabile scelto da Firefox), ma, per quanto posso dire, non in IE8 o Safari. Il metodo glifo è suggerito here. Il codice è a posto, ma ottenere i caratteri sembra un problema. Inkscape mi sembra abbastanza impenetrabile. Per quanto posso dire, ciò che è necessario è molto simile ai vecchi font pen-plotter: un percorso vettoriale con comandi pen-up e pen-down tra le esecuzioni dei nodi. Risulta che FSF/GNU ha alcuni che potrebbero essere massaggiati nel formato giusto senza troppi problemi. Non so dove sia definito il formato, ma è probabilmente finito al W3C da qualche parte. L'approccio con potenziale reale per i font presentabili è l'ala IE/VML di Cufon. Vedi How does it work? Voglio davvero questo ultimo collegamento della catena, ma potrei usare un po 'di aiuto.

Processing.js è una balena di un progetto che merita il nostro supporto. Ha un potenziale enorme. Ti incoraggerei a lanciare se sei in grado.