How to escape '-' hyphen symbol from xml in MathJax - mathjax

<!DOCTYPE html>
<html>
<head>
<title>MathJax MathML Test Page</title>
<script type="text/javascript" id="MathJax-script" async
src="https://cdn.jsdelivr.net/npm/mathjax#3/es5/mml-chtml.js">
</script>
</head>
<body>
<p>
<math overflow="scroll"><mfrac><msup><msub><mi mathvariant="-italic">Q</mi><mrow><msub><mi mathvariant="italic">T</mi><mi mathvariant="italic">i</mi></msub><mo mathvariant="italic">max</mo></mrow></msub><mn mathvariant="normal">0.75</mn></msup><msup><mi mathvariant="italic">β</mi><mn mathvariant="normal">0.75</mn></msup></mfrac><mo>≤</mo><mn mathvariant="normal">5</mn><mo>×</mo><msub><mi mathvariant="italic">AEL</mi><msub><mi mathvariant="italic">T</mi><mi mathvariant="italic">i</mi></msub></msub><mo>×</mo><msup><msub><mi mathvariant="italic">Q</mi><msub><mi mathvariant="italic">T</mi><mi mathvariant="italic">m</mi></msub></msub><mrow><mo>−</mo><mn mathvariant="normal">0.25</mn></mrow></msup><mo></mo></math>
</p>
</body>
</html>
Getting parsing error with new CDN https://cdn.jsdelivr.net/npm/mathjax#3/es5/mml-chtml.js


Here is a configuration you can use to post-filter the MathML to fix the invalid -italic math variant value.
MathJax = {
startup: {
ready() {
MathJax.startup.defaultReady();
MathJax.startup.input[0].postFilters.add(({data}) => {
data.walkTree(node => {
if (node.attributes) {
if (node.attributes.get('mathvariant') === '-italic') {
node.attributes.set('mathvariant', 'italic');
}
}
});
});
}
}
}
Place this in a <script> tag just before the script that loads mml-html.js.

Related

Bokeh is not generating plot and is instead returning an HTML file

I am new to Python and was trying out the Bokeh library. I try to plot a basic line graph and instead of returning the graph I get an ouput HTML file. When I ran the HTML code it looks like the graph does generate. Does anyone have any idea why the show() method is not showing me the chart as expected. I tried this in both Jupyter Notebook as well as Atom and both return the HTML code. I am running Windows 7 as well.
My code:
from bokeh.plotting import figure
from bokeh.io import output_file , show
x=[1,2,3,4,5]
y=[6,7,8,9,10]
output_file("test1.html")
f=figure()
f.line(x,y)
show(f)
Returned HTML file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bokeh Plot</title>
<link rel="stylesheet" href="https://cdn.bokeh.org/bokeh/release/bokeh-0.13.0.min.css" type="text/css" />
<script type="text/javascript" src="https://cdn.bokeh.org/bokeh/release/bokeh-0.13.0.min.js"></script>
<script type="text/javascript">
Bokeh.set_log_level("info");
</script>
</head>
<body>
<div class="bk-root" id="d48bbd43-55c8-4727-befa-468754bdb0b5"></div>
<script type="application/json" id="41bd10a1-5a61-4504-80f1-8c56f40e644b">
{"c99a857f-320f-48ba-8576-3ef2bd47c6ce":{"roots":{"references":[{"attributes":{},"id":"c17f31c6-ea53-4bda-b425-65e087f9b126","type":"SaveTool"},{"attributes":{},"id":"d5662033-1332-448f-8078-b1b5fc6ebedd","type":"ResetTool"},{"attributes":{"overlay":{"id":"647df24a-7a53-48f7-850b-e99faaf7e12c","type":"BoxAnnotation"}},"id":"2ebb0a9b-1f3e-4e0e-b54c-dab483d9ad1d","type":"BoxZoomTool"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_multi":null,"active_scroll":"auto","active_tap":"auto","tools":[{"id":"eea39d89-6da1-4401-a6bb-41d0ad5fd1a9","type":"PanTool"},{"id":"dbdcf43e-f6cd-4999-8664-7d4bbeb28b1b","type":"WheelZoomTool"},{"id":"5e93a11e-972b-4ea4-9ebd-e030a0a92bf5","type":"BoxZoomTool"},{"id":"7b78cfe2-aa29-4245-98c3-b8678943be2c","type":"SaveTool"},{"id":"d5662033-1332-448f-8078-b1b5fc6ebedd","type":"ResetTool"},{"id":"3bcc793e-9b7f-42f7-b939-437b29982b6f","type":"HelpTool"}]},"id":"e29112ae-02d0-4dc6-9788-c3bcd084c560","type":"Toolbar"},{"attributes":{},"id":"ee7e7d93-1a3d-4273-ad05-0dae9c2e2608","type":"BasicTicker"},{"attributes":{"data_source":{"id":"7fedd7ce-eb1b-4533-8e35-492e9f4f6723","type":"ColumnDataSource"},"glyph":{"id":"5c2d97f3-520b-4a40-b4a2-41bde9d2dbc6","type":"Line"},"hover_glyph":null,"muted_glyph":null,"nonselection_glyph":{"id":"762d72ea-6726-4767-aed8-9a5abfbd3abf","type":"Line"},"selection_glyph":null,"view":{"id":"d9fbc277-e9f7-409c-a9b7-8362fed1fe82","type":"CDSView"}},"id":"d495f273-35fd-4f1d-a7c7-44cdc6e2043b","type":"GlyphRenderer"},{"attributes":{},"id":"fdf26c70-7fce-4158-800f-62ef31b890ac","type":"ResetTool"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"plot":null,"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"56b62953-67f6-43e5-8665-1ae0b33a3587","type":"BoxAnnotation"},{"attributes":{},"id":"f2bb603d-d041-46dc-9149-5d20c78da06e","type":"PanTool"},{"attributes":{"callback":null,"data":{"x":[1,2,3,4,5],"y":[6,7,8,9,10]},"selected":{"id":"7453ce84-2208-4e58-9d06-ddd3ca1708f6","type":"Selection"},"selection_policy":{"id":"601e5c38-1a36-447b-83d5-64411a4833e8","type":"UnionRenderers"}},"id":"21c90c7e-c156-400b-ba70-8b67b31b460c","type":"ColumnDataSource"},{"attributes":{},"id":"7c17ff42-bbc4-4e59-a0b3-eebe55024f05","type":"BasicTicker"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_multi":null,"active_scroll":"auto","active_tap":"auto","tools":[{"id":"f2bb603d-d041-46dc-9149-5d20c78da06e","type":"PanTool"},{"id":"ad0a537b-c0d3-4808-846f-be215dbd4631","type":"WheelZoomTool"},{"id":"2ebb0a9b-1f3e-4e0e-b54c-dab483d9ad1d","type":"BoxZoomTool"},{"id":"c17f31c6-ea53-4bda-b425-65e087f9b126","type":"SaveTool"},{"id":"fdf26c70-7fce-4158-800f-62ef31b890ac","type":"ResetTool"},{"id":"949b3238-ac22-4ad2-b652-af77d2e455ad","type":"HelpTool"}]},"id":"096653f5-de71-4386-8bb7-0712ad1765ca","type":"Toolbar"},{"attributes":{},"id":"18ee1741-c202-4f4b-b52e-c2cc490b8f6f","type":"BasicTicker"},{"attributes":{"formatter":{"id":"83cded7e-dad6-4fc7-b0f2-761cc4012436","type":"BasicTickFormatter"},"plot":{"id":"4da3e749-cdb4-48ed-8dc6-b78818d8f587","subtype":"Figure","type":"Plot"},"ticker":{"id":"7c17ff42-bbc4-4e59-a0b3-eebe55024f05","type":"BasicTicker"}},"id":"f5b7139e-5848-412b-9e0b-9c60547d3a47","type":"LinearAxis"},{"attributes":{"data_source":{"id":"21c90c7e-c156-400b-ba70-8b67b31b460c","type":"ColumnDataSource"},"glyph":{"id":"58e9f325-f8d1-44cb-9e83-f757a0bd329a","type":"Line"},"hover_glyph":null,"muted_glyph":null,"nonselection_glyph":{"id":"b6c181de-6d18-433b-8bbd-b14169b56eb5","type":"Line"},"selection_glyph":null,"view":{"id":"64bb6a0d-f877-4657-9ade-525ec88605a9","type":"CDSView"}},"id":"f17257ba-4f75-42c7-893b-a4cf0036740b","type":"GlyphRenderer"},{"attributes":{"dimension":1,"plot":{"id":"4da3e749-cdb4-48ed-8dc6-b78818d8f587","subtype":"Figure","type":"Plot"},"ticker":{"id":"7c17ff42-bbc4-4e59-a0b3-eebe55024f05","type":"BasicTicker"}},"id":"448ae753-190a-47b3-b48c-48d42ad5c905","type":"Grid"},{"attributes":{"callback":null},"id":"320a3e54-e61a-45c3-b12e-64c5570e1c82","type":"DataRange1d"},{"attributes":{"plot":{"id":"4da3e749-cdb4-48ed-8dc6-b78818d8f587","subtype":"Figure","type":"Plot"},"ticker":{"id":"ee7e7d93-1a3d-4273-ad05-0dae9c2e2608","type":"BasicTicker"}},"id":"408bec16-a4cc-48b8-a8e8-9753f9815ed4","type":"Grid"},{"attributes":{},"id":"86e986bf-1069-41b3-b75c-db7e68d1b161","type":"LinearScale"},{"attributes":{},"id":"9e7303e6-a33a-4cfd-8a41-23f8c9b4fe8f","type":"LinearScale"},{"attributes":{},"id":"4d5fd9c6-8637-4d02-b775-2411c95a5d06","type":"LinearScale"},{"attributes":{"formatter":{"id":"f2264866-9fec-45b0-b242-5111fcc1c4fb","type":"BasicTickFormatter"},"plot":{"id":"2da75283-6f20-4600-884a-98e59b066e28","subtype":"Figure","type":"Plot"},"ticker":{"id":"69a59dc3-f814-4f87-a39d-e79d8e0c624c","type":"BasicTicker"}},"id":"264bb8f9-c4f8-4f19-959e-25e2f7c2a656","type":"LinearAxis"},{"attributes":{},"id":"3bcc793e-9b7f-42f7-b939-437b29982b6f","type":"HelpTool"},{"attributes":{"dimension":1,"plot":{"id":"2da75283-6f20-4600-884a-98e59b066e28","subtype":"Figure","type":"Plot"},"ticker":{"id":"69a59dc3-f814-4f87-a39d-e79d8e0c624c","type":"BasicTicker"}},"id":"f496d5a9-0ee6-460b-9016-3fa5c19a56a7","type":"Grid"},{"attributes":{},"id":"1b240c0f-07b2-4113-a8a8-a4efc1583fdd","type":"BasicTickFormatter"},{"attributes":{},"id":"69a59dc3-f814-4f87-a39d-e79d8e0c624c","type":"BasicTicker"},{"attributes":{"source":{"id":"7fedd7ce-eb1b-4533-8e35-492e9f4f6723","type":"ColumnDataSource"}},"id":"d9fbc277-e9f7-409c-a9b7-8362fed1fe82","type":"CDSView"},{"attributes":{"callback":null},"id":"98a9bfe3-e787-4432-af9d-0f3f9f086166","type":"DataRange1d"},{"attributes":{},"id":"7453ce84-2208-4e58-9d06-ddd3ca1708f6","type":"Selection"},{"attributes":{"plot":{"id":"2da75283-6f20-4600-884a-98e59b066e28","subtype":"Figure","type":"Plot"},"ticker":{"id":"18ee1741-c202-4f4b-b52e-c2cc490b8f6f","type":"BasicTicker"}},"id":"937c1124-b157-4eca-a0b3-75f6ef2dda90","type":"Grid"},{"attributes":{"callback":null},"id":"95e74f2e-df09-4945-a76e-c185eea3d4df","type":"DataRange1d"},{"attributes":{"formatter":{"id":"2030a3a4-7747-427a-a1dd-ffc3901ee9be","type":"BasicTickFormatter"},"plot":{"id":"4da3e749-cdb4-48ed-8dc6-b78818d8f587","subtype":"Figure","type":"Plot"},"ticker":{"id":"ee7e7d93-1a3d-4273-ad05-0dae9c2e2608","type":"BasicTicker"}},"id":"90583a87-4ad1-402c-aa3c-1a3c661e7406","type":"LinearAxis"},{"attributes":{"source":{"id":"7f04e4d5-b03b-4ebb-a89d-f65cbb91b729","type":"ColumnDataSource"}},"id":"58980905-7efb-4a11-8de9-9b10e9b1d1c8","type":"CDSView"},{"attributes":{"callback":null,"data":{"x":[3,7.5,10],"y":[3,6,9]},"selected":{"id":"668b3eb0-b6de-4fc7-ae7b-d1a7ce923009","type":"Selection"},"selection_policy":{"id":"4dc9ce99-d94b-4fbd-9ed2-ef8bb292be8b","type":"UnionRenderers"}},"id":"7f04e4d5-b03b-4ebb-a89d-f65cbb91b729","type":"ColumnDataSource"},{"attributes":{"line_alpha":0.1,"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"762d72ea-6726-4767-aed8-9a5abfbd3abf","type":"Line"},{"attributes":{},"id":"5ec88388-4913-436f-b8a6-cfd6d391154c","type":"BasicTickFormatter"},{"attributes":{},"id":"eea39d89-6da1-4401-a6bb-41d0ad5fd1a9","type":"PanTool"},{"attributes":{"callback":null},"id":"d9d21cdf-f19b-4f95-98ba-ef43d9aec5a7","type":"DataRange1d"},{"attributes":{},"id":"ad0a537b-c0d3-4808-846f-be215dbd4631","type":"WheelZoomTool"},{"attributes":{"formatter":{"id":"1b240c0f-07b2-4113-a8a8-a4efc1583fdd","type":"BasicTickFormatter"},"plot":{"id":"2da75283-6f20-4600-884a-98e59b066e28","subtype":"Figure","type":"Plot"},"ticker":{"id":"18ee1741-c202-4f4b-b52e-c2cc490b8f6f","type":"BasicTicker"}},"id":"8977dc31-58c8-4dda-95bc-70199558a319","type":"LinearAxis"},{"attributes":{},"id":"2030a3a4-7747-427a-a1dd-ffc3901ee9be","type":"BasicTickFormatter"},{"attributes":{},"id":"541dc82f-bd18-4993-adff-060c1167d6ab","type":"Selection"},{"attributes":{},"id":"4dc9ce99-d94b-4fbd-9ed2-ef8bb292be8b","type":"UnionRenderers"},{"attributes":{},"id":"83cded7e-dad6-4fc7-b0f2-761cc4012436","type":"BasicTickFormatter"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"plot":null,"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"647df24a-7a53-48f7-850b-e99faaf7e12c","type":"BoxAnnotation"},{"attributes":{},"id":"949b3238-ac22-4ad2-b652-af77d2e455ad","type":"HelpTool"},{"attributes":{"formatter":{"id":"5ec88388-4913-436f-b8a6-cfd6d391154c","type":"BasicTickFormatter"},"plot":{"id":"635f8152-f2d6-4568-ae68-2973f310eaf8","subtype":"Figure","type":"Plot"},"ticker":{"id":"164ee759-2971-4dd9-ac18-35cdb02fca0e","type":"BasicTicker"}},"id":"f1e22f73-d0fc-46b4-a3b4-b264cf417d4a","type":"LinearAxis"},{"attributes":{"callback":null},"id":"0eb66654-fd86-43a2-8b94-2f345c420dec","type":"DataRange1d"},{"attributes":{},"id":"dbdcf43e-f6cd-4999-8664-7d4bbeb28b1b","type":"WheelZoomTool"},{"attributes":{"callback":null},"id":"66ecc1d0-d899-41cd-b791-13176cd24a81","type":"DataRange1d"},{"attributes":{},"id":"26a46564-9ff5-4fdb-987a-a2119540680b","type":"LinearScale"},{"attributes":{"formatter":{"id":"e87b8867-6df4-4f58-a378-25f653b25bf6","type":"BasicTickFormatter"},"plot":{"id":"635f8152-f2d6-4568-ae68-2973f310eaf8","subtype":"Figure","type":"Plot"},"ticker":{"id":"cfd25d7d-feea-4647-911d-6a5605dc3d71","type":"BasicTicker"}},"id":"474d496d-aa15-4fe3-b163-0a629270845f","type":"LinearAxis"},{"attributes":{"below":[{"id":"90583a87-4ad1-402c-aa3c-1a3c661e7406","type":"LinearAxis"}],"left":[{"id":"f5b7139e-5848-412b-9e0b-9c60547d3a47","type":"LinearAxis"}],"renderers":[{"id":"90583a87-4ad1-402c-aa3c-1a3c661e7406","type":"LinearAxis"},{"id":"408bec16-a4cc-48b8-a8e8-9753f9815ed4","type":"Grid"},{"id":"f5b7139e-5848-412b-9e0b-9c60547d3a47","type":"LinearAxis"},{"id":"448ae753-190a-47b3-b48c-48d42ad5c905","type":"Grid"},{"id":"647df24a-7a53-48f7-850b-e99faaf7e12c","type":"BoxAnnotation"},{"id":"d495f273-35fd-4f1d-a7c7-44cdc6e2043b","type":"GlyphRenderer"}],"title":{"id":"d4c3a0d9-1a75-4bf7-a107-1d30bf785c76","type":"Title"},"toolbar":{"id":"096653f5-de71-4386-8bb7-0712ad1765ca","type":"Toolbar"},"x_range":{"id":"95e74f2e-df09-4945-a76e-c185eea3d4df","type":"DataRange1d"},"x_scale":{"id":"c561783a-f07e-44c4-8bce-04e3a3363ae6","type":"LinearScale"},"y_range":{"id":"0eb66654-fd86-43a2-8b94-2f345c420dec","type":"DataRange1d"},"y_scale":{"id":"4d5fd9c6-8637-4d02-b775-2411c95a5d06","type":"LinearScale"}},"id":"4da3e749-cdb4-48ed-8dc6-b78818d8f587","subtype":"Figure","type":"Plot"},{"attributes":{},"id":"f95a9d96-e1ac-4ce5-bc22-36cf2f38f282","type":"LinearScale"},{"attributes":{"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"5c2d97f3-520b-4a40-b4a2-41bde9d2dbc6","type":"Line"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_multi":null,"active_scroll":"auto","active_tap":"auto","tools":[{"id":"568ebe47-1b17-4fc7-8859-72a1e4b19c03","type":"PanTool"},{"id":"e1d4052b-2921-4d77-ad94-6918560aa1ba","type":"WheelZoomTool"},{"id":"0854e626-a869-4df9-8767-e630ecd58a96","type":"BoxZoomTool"},{"id":"110fc368-ca75-4219-8f15-890fcdb2f36b","type":"SaveTool"},{"id":"885ac673-f730-49e8-813f-64fd64eaf473","type":"ResetTool"},{"id":"f80496c0-9c80-4a80-8f2f-da85474351ca","type":"HelpTool"}]},"id":"f941560f-8e6b-451c-9eb8-adefc4eb40ab","type":"Toolbar"},{"attributes":{"below":[{"id":"f1e22f73-d0fc-46b4-a3b4-b264cf417d4a","type":"LinearAxis"}],"left":[{"id":"474d496d-aa15-4fe3-b163-0a629270845f","type":"LinearAxis"}],"renderers":[{"id":"f1e22f73-d0fc-46b4-a3b4-b264cf417d4a","type":"LinearAxis"},{"id":"76ad232d-7081-49f8-aed9-647e4230aca4","type":"Grid"},{"id":"474d496d-aa15-4fe3-b163-0a629270845f","type":"LinearAxis"},{"id":"c3bc6c16-6356-43da-9153-d0f6463dc876","type":"Grid"},{"id":"9f88dd88-dbad-4b5b-ae2d-b1d2d8c36a15","type":"BoxAnnotation"},{"id":"e8a9236a-3159-4555-ab32-5a71f98315fe","type":"GlyphRenderer"}],"title":{"id":"398834ce-a8d9-46e0-923e-ab71eb6e8aa8","type":"Title"},"toolbar":{"id":"f941560f-8e6b-451c-9eb8-adefc4eb40ab","type":"Toolbar"},"x_range":{"id":"320a3e54-e61a-45c3-b12e-64c5570e1c82","type":"DataRange1d"},"x_scale":{"id":"26a46564-9ff5-4fdb-987a-a2119540680b","type":"LinearScale"},"y_range":{"id":"66ecc1d0-d899-41cd-b791-13176cd24a81","type":"DataRange1d"},"y_scale":{"id":"f95a9d96-e1ac-4ce5-bc22-36cf2f38f282","type":"LinearScale"}},"id":"635f8152-f2d6-4568-ae68-2973f310eaf8","subtype":"Figure","type":"Plot"},{"attributes":{"plot":{"id":"635f8152-f2d6-4568-ae68-2973f310eaf8","subtype":"Figure","type":"Plot"},"ticker":{"id":"164ee759-2971-4dd9-ac18-35cdb02fca0e","type":"BasicTicker"}},"id":"76ad232d-7081-49f8-aed9-647e4230aca4","type":"Grid"},{"attributes":{},"id":"164ee759-2971-4dd9-ac18-35cdb02fca0e","type":"BasicTicker"},{"attributes":{"callback":null,"data":{"x":[1,2,3,4,5],"y":[6,7,8,9,10]},"selected":{"id":"541dc82f-bd18-4993-adff-060c1167d6ab","type":"Selection"},"selection_policy":{"id":"ad391a37-ff57-4e0e-a32f-1fc91db098fc","type":"UnionRenderers"}},"id":"7fedd7ce-eb1b-4533-8e35-492e9f4f6723","type":"ColumnDataSource"},{"attributes":{"dimension":1,"plot":{"id":"635f8152-f2d6-4568-ae68-2973f310eaf8","subtype":"Figure","type":"Plot"},"ticker":{"id":"cfd25d7d-feea-4647-911d-6a5605dc3d71","type":"BasicTicker"}},"id":"c3bc6c16-6356-43da-9153-d0f6463dc876","type":"Grid"},{"attributes":{},"id":"cfd25d7d-feea-4647-911d-6a5605dc3d71","type":"BasicTicker"},{"attributes":{},"id":"c561783a-f07e-44c4-8bce-04e3a3363ae6","type":"LinearScale"},{"attributes":{},"id":"ad391a37-ff57-4e0e-a32f-1fc91db098fc","type":"UnionRenderers"},{"attributes":{"plot":null,"text":""},"id":"398834ce-a8d9-46e0-923e-ab71eb6e8aa8","type":"Title"},{"attributes":{},"id":"568ebe47-1b17-4fc7-8859-72a1e4b19c03","type":"PanTool"},{"attributes":{},"id":"e1d4052b-2921-4d77-ad94-6918560aa1ba","type":"WheelZoomTool"},{"attributes":{"overlay":{"id":"9f88dd88-dbad-4b5b-ae2d-b1d2d8c36a15","type":"BoxAnnotation"}},"id":"0854e626-a869-4df9-8767-e630ecd58a96","type":"BoxZoomTool"},{"attributes":{},"id":"110fc368-ca75-4219-8f15-890fcdb2f36b","type":"SaveTool"},{"attributes":{},"id":"885ac673-f730-49e8-813f-64fd64eaf473","type":"ResetTool"},{"attributes":{},"id":"f80496c0-9c80-4a80-8f2f-da85474351ca","type":"HelpTool"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"plot":null,"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"9f88dd88-dbad-4b5b-ae2d-b1d2d8c36a15","type":"BoxAnnotation"},{"attributes":{"fill_alpha":{"value":0.1},"fill_color":{"value":"#1f77b4"},"line_alpha":{"value":0.1},"line_color":{"value":"#1f77b4"},"x":{"field":"x"},"y":{"field":"y"}},"id":"8f473bf9-6ee0-4c0f-b549-b2f0b00fa17f","type":"Triangle"},{"attributes":{"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"58e9f325-f8d1-44cb-9e83-f757a0bd329a","type":"Line"},{"attributes":{"line_alpha":0.1,"line_color":"#1f77b4","x":{"field":"x"},"y":{"field":"y"}},"id":"b6c181de-6d18-433b-8bbd-b14169b56eb5","type":"Line"},{"attributes":{},"id":"668b3eb0-b6de-4fc7-ae7b-d1a7ce923009","type":"Selection"},{"attributes":{"plot":null,"text":""},"id":"d4c3a0d9-1a75-4bf7-a107-1d30bf785c76","type":"Title"},{"attributes":{},"id":"e87b8867-6df4-4f58-a378-25f653b25bf6","type":"BasicTickFormatter"},{"attributes":{},"id":"7b78cfe2-aa29-4245-98c3-b8678943be2c","type":"SaveTool"},{"attributes":{},"id":"601e5c38-1a36-447b-83d5-64411a4833e8","type":"UnionRenderers"},{"attributes":{"data_source":{"id":"7f04e4d5-b03b-4ebb-a89d-f65cbb91b729","type":"ColumnDataSource"},"glyph":{"id":"cda92757-3dcd-42cb-95b9-392e57684258","type":"Triangle"},"hover_glyph":null,"muted_glyph":null,"nonselection_glyph":{"id":"8f473bf9-6ee0-4c0f-b549-b2f0b00fa17f","type":"Triangle"},"selection_glyph":null,"view":{"id":"58980905-7efb-4a11-8de9-9b10e9b1d1c8","type":"CDSView"}},"id":"e8a9236a-3159-4555-ab32-5a71f98315fe","type":"GlyphRenderer"},{"attributes":{"below":[{"id":"8977dc31-58c8-4dda-95bc-70199558a319","type":"LinearAxis"}],"left":[{"id":"264bb8f9-c4f8-4f19-959e-25e2f7c2a656","type":"LinearAxis"}],"renderers":[{"id":"8977dc31-58c8-4dda-95bc-70199558a319","type":"LinearAxis"},{"id":"937c1124-b157-4eca-a0b3-75f6ef2dda90","type":"Grid"},{"id":"264bb8f9-c4f8-4f19-959e-25e2f7c2a656","type":"LinearAxis"},{"id":"f496d5a9-0ee6-460b-9016-3fa5c19a56a7","type":"Grid"},{"id":"56b62953-67f6-43e5-8665-1ae0b33a3587","type":"BoxAnnotation"},{"id":"f17257ba-4f75-42c7-893b-a4cf0036740b","type":"GlyphRenderer"}],"title":{"id":"af901232-8aa2-488c-932c-c8e5dda2750d","type":"Title"},"toolbar":{"id":"e29112ae-02d0-4dc6-9788-c3bcd084c560","type":"Toolbar"},"x_range":{"id":"98a9bfe3-e787-4432-af9d-0f3f9f086166","type":"DataRange1d"},"x_scale":{"id":"86e986bf-1069-41b3-b75c-db7e68d1b161","type":"LinearScale"},"y_range":{"id":"d9d21cdf-f19b-4f95-98ba-ef43d9aec5a7","type":"DataRange1d"},"y_scale":{"id":"9e7303e6-a33a-4cfd-8a41-23f8c9b4fe8f","type":"LinearScale"}},"id":"2da75283-6f20-4600-884a-98e59b066e28","subtype":"Figure","type":"Plot"},{"attributes":{"overlay":{"id":"56b62953-67f6-43e5-8665-1ae0b33a3587","type":"BoxAnnotation"}},"id":"5e93a11e-972b-4ea4-9ebd-e030a0a92bf5","type":"BoxZoomTool"},{"attributes":{"plot":null,"text":""},"id":"af901232-8aa2-488c-932c-c8e5dda2750d","type":"Title"},{"attributes":{"fill_color":{"value":"#1f77b4"},"line_color":{"value":"#1f77b4"},"x":{"field":"x"},"y":{"field":"y"}},"id":"cda92757-3dcd-42cb-95b9-392e57684258","type":"Triangle"},{"attributes":{"source":{"id":"21c90c7e-c156-400b-ba70-8b67b31b460c","type":"ColumnDataSource"}},"id":"64bb6a0d-f877-4657-9ade-525ec88605a9","type":"CDSView"},{"attributes":{},"id":"f2264866-9fec-45b0-b242-5111fcc1c4fb","type":"BasicTickFormatter"}],"root_ids":["635f8152-f2d6-4568-ae68-2973f310eaf8","2da75283-6f20-4600-884a-98e59b066e28","4da3e749-cdb4-48ed-8dc6-b78818d8f587"]},"title":"Bokeh Application","version":"0.13.0"}}
</script>
<script type="text/javascript">
(function() {
var fn = function() {
Bokeh.safely(function() {
(function(root) {
function embed_document(root) {
var docs_json = document.getElementById('41bd10a1-5a61-4504-80f1-8c56f40e644b').textContent;
var render_items = [{"docid":"c99a857f-320f-48ba-8576-3ef2bd47c6ce","roots":{"4da3e749-cdb4-48ed-8dc6-b78818d8f587":"d48bbd43-55c8-4727-befa-468754bdb0b5"}}];
root.Bokeh.embed.embed_items(docs_json, render_items);
}
if (root.Bokeh !== undefined) {
embed_document(root);
} else {
var attempts = 0;
var timer = setInterval(function(root) {
if (root.Bokeh !== undefined) {
embed_document(root);
clearInterval(timer);
}
attempts++;
if (attempts > 100) {
console.log("Bokeh: ERROR: Unable to run BokehJS code because BokehJS library is missing")
clearInterval(timer);
}
}, 10, root)
}
})(window);
});
};
if (document.readyState != "loading") fn();
else document.addEventListener("DOMContentLoaded", fn);
})();
</script>
</body>
</html>

Yes that will happen but is easy to resolve :
right click the (output html file) in working folder ---> hover over open with----> choose default program---> click on always open with (google chrome)
Now the next time you run your code plot will open up in chrome instead of .html file in notepad

Destroy Darkroom / Fabric JS Canvas

$(function() {
$('button').on('click', function() {
new Darkroom('#edit', {
plugins: {
save: {
callback: function() {
console.log('saving');
var darkroom = this.darkroom;
darkroom.canvas.clear().renderAll();
darkroom.selfDestroy();
return true;
}
}
}
});
});
});
<html>
<head>
<link href="https://rawgithub.com/MattKetmo/darkroomjs/master/build/darkroom.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/1.6.2/fabric.min.js"></script>
<script src="https://rawgit.com/MattKetmo/darkroomjs/master/build/darkroom.js"></script>
</head>
<body>
<div style="margin-top:50px">
<img id="edit" class="data-uri-example" src="data:image/gif;base64,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">
</div>
<button type="button">Edit</button>
</body </html>
Using darkroom js and fabric js. After I save the canvas data I want to remove the img/canvas from the page. The original img tag used in initialization '#edit' is no longer an element on the page. Seems it's replaces by a new img.
I've tried the .clear() also .clear().renderAll(). I get no error but the image still shows on the page.

Remove div element for control Darkroom and in code create again
$(function () {
$('button').on('click', function () {
$('#main-el').html('');
$('#main-el').append('<img id="edit" class="data-uri-example" src="...">');
new Darkroom('#edit');
});
});

RequireJS module that extends another module

I'm using a project that has 2 different files wrapped in AMD which one extends the other, project is jsondiffpatch.
The project has 2 files (build/bundle.js and build/formatters.js) each export jsondiffpatch. When I include them in my file like:
define(['jsondiffpatch',
'jsondiffpatch-formatters'], function (jsondiffpatch) {
});
the formatters extensions are not present. If I change the main config make jsondiffpath depend on the formatters like:
shim: {
'jsondiffpatch': {
deps: ['jsondiffpatch-formatters']
}
}
I still don't get the formatters. This is a pretty common practice, but haven't seen to overcome it; i know its something simple, what am i missing?

This should work:
shim: {
'jsondiffpatch-formatters': {
deps: ['jsondiffpatch'],
exports: 'jsondiffpatch.formatters'
},
'jsondiffpatch': {
exports: 'jsondiffpatch'
}
}

When you load jsondiffpatch with an AMD loader like RequireJS the formatters are a different module. In other words, it works slightly differently from when you load jsondiffpatch without an AMD-loader. Here's a complete example:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/xhtml; charset=utf-8"/>
<link rel="stylesheet" href="bower_components/jsondiffpatch/src/formatters/html.css" type="text/css" />
<link rel="stylesheet" href="bower_components/jsondiffpatch/src/formatters/annotated.css" type="text/css" />
</head>
<script type="text/javascript" src="bower_components/requirejs/require.js"></script>
</head>
<body>
<div id="visual"></div>
<hr/>
<div id="annotated"></div>
<script>
require.config({
baseUrl: ".",
paths: {
jsondiffpatch: "bower_components/jsondiffpatch/build/bundle",
"jsondiffpatch.formatters": "bower_components/jsondiffpatch/build/formatters"
},
enforceDefine: true
});
require(["jsondiffpatch", "jsondiffpatch.formatters"],
function (jsdp, formatters) {
//
// Code here adapted from jsondiffpatch's examples:
// https://github.com/benjamine/jsondiffpatch
//
var left = { a: 3, b: 4 };
var right = { a: 5, c: 9 };
var delta = jsdp.diff(left, right);
document.getElementById('visual').innerHTML =
formatters.html.format(delta, left);
document.getElementById('annotated').innerHTML =
formatters.annotated.format(delta, left);
});
</script>
</body>
</html>
The only thing you need other than this HTML above is to install RequireJS and jsondiffpatch with Bower.

is there a way to add CSS/JS later using EJS with nodejs/express

i'm using the EJS template engine with nodejs/express and i'm wondering if it's possible to add another css or js file in e.g the index.ejs (not the layout.ejs)
layout.ejs
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<link rel='stylesheet' href='/stylesheets/smoothness/jquery-ui-1.8.14.custom.css' />
</head>
<body>
<%- body %>
</body>
</html>
index.ejs
<h1><%= title %></h1>
<p>Welcome to <%= title %></p>
i don't want to add the second css file in every template but only the index.ejs - is there any way i can do that?

found a solution here: Node.js with Express: Importing client-side javascript using script tags in Jade views?
it's using jade instead of EJS but works all the same.
here are some code-snippets for express 2.4.0.
you have to add the following "helpers" to your app.js
app.helpers({
renderScriptsTags: function (all) {
if (all != undefined) {
return all.map(function(script) {
return '<script src="/javascripts/' + script + '"></script>';
}).join('\n ');
}
else {
return '';
}
}
});
app.dynamicHelpers({
scripts: function(req, res) {
return ['jquery-1.5.1.min.js'];
}
});
the layout.ejs looks sth like this:
<!DOCTYPE html>
<html>
<head>
<title><%= title %></title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<%- renderScriptsTags(scripts) %>
</head>
<body>
<%- body %>
</body>
</html>
if you don't add any scripts to the scripts-array, only 'jquery-1.5.1.min.js' will be included - if you want to add files to a subpage you can do this like so:
test.ejs
<% scripts.push('jquery-ui-1.8.14.custom.min.js', 'jquery.validate.min.js') %>
<h1><%= title %></h1>
<p>I'm a template with 3 js files in the header</p>
that's it.

As helpers and dynamicHelpers are gone in Express > 3, I rewrote pkyeck code so it works in Express 3.
So in app.js have this instead of the helpers / dynamicHelpers. Leave everything else as is.
app.locals({
scripts: [],
renderScriptsTags: function (all) {
app.locals.scripts = [];
if (all != undefined) {
return all.map(function(script) {
return '<script src="/javascripts/' + script + '"></script>';
}).join('\n ');
}
else {
return '';
}
},
getScripts: function(req, res) {
return scripts;
}
});

In app.js add line:
app.set('views', __dirname + '/views');
app.set('view engine', 'ejs');
app.use(express.static(__dirname + '/public')); // This line.
In layout.ejs:
<!DOCTYPE html>
<html>
<head>
<title>Authentication Example</title>
<link rel="stylesheet" href="/stylesheets/style.css"/>
<script src="/javascripts/jquery.js"></script>
</head>
<body>
<%- body %>
</body>
</html>
In index.ejs or login.ejs:
<h1>Login</h1>
<form method="post" action="/login">
<p>
<label>Username:</label>
<input type="text" name="username">
</p>
<p>
<label>Password:</label>
<input type="text" name="password">
</p>
<p>
<input type="submit" value="Login">
</p>
</form>
<script src="/javascripts/test.js"></script> <!-- Second Script -->
In test.js:
$(document).ready(function() {
try{
alert("Hi!!!");
}catch(e)
{
alert("Error");
}
});
Regards.

Thanks #asprotte for providing this for express 4.x. Did you tested this?
Because it does not appears to be working for me. So I have made some changes to your code here are they:
Put this in app.js file
app.locals.scripts = [];
app.locals.addScripts=function (all) {
app.locals.scripts = [];
if (all != undefined) {
app.locals.scripts = all.map(function(script) {
console.log(script);
return "<script src='/js/" + script + "'></script>";
}).join('\n ');
}
};
app.locals.getScripts = function(req, res) {
return app.locals.scripts;
};
then in template file put (I am using ejs template here) :
<% addScripts(['cart.js']) %>
Then in the layout file we need these to append at the bottom of the page get the scripts
<%- getScripts() %>
I have tested it and its working for me. Please correct me if I am wrong.
Thanks,

Thanks for illustrating this option pkyeck!
In express 4.x app.locals is an object. Here's pkyeck's answer rewritten to work in express 4.x:
app.locals.scripts = [];
app.locals.addScripts=function (all) {
app.locals.scripts = [];
if (all != undefined) {
return all.map(function(script) {
return "<script src='/javascripts/" + script + "'></script>";
}).join('\n ');
}
else {
return '';
}
};
app.locals.getScripts = function(req, res) {
return scripts;
};

YUI CustomEvent no errors being reported

Does anyone know how to get the below to report a javascript error? (any browser)
<head>
<title></title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/yui/2.6.0/build/yahoo-dom-event/yahoo-dom-event.js">
</script>
<script type="text/javascript">
ObjWithEvent = {
testEvent: new YAHOO.util.CustomEvent("testEvent")
};
ObjSubscriber = {
handleTestEvent: function(){
alert('the next line will not show up in the error console');
not_a_valid_function_bro();
}
};
ObjWithEvent.testEvent.subscribe(ObjSubscriber.handleTestEvent);
ObjWithEvent.testEvent.fire();
</script>
</head>
<body>
</body>

Possibly one of the worst chosen default settings ever.....
YAHOO.util.Event.throwErrors is set to false by default, so if you want to see errors:
YAHOO.util.Event.throwErrors = true;

Resources