yes, thanks I saw that when I run the script several times in the notebook, they all get updated. This explains the use of uuids in some code that that I found when searching fro examples.
On Thursday, January 19, 2017 at 3:59:31 PM UTC, Jason Grout wrote: > > You'll also want to generate a unique ID every time you display, so you > don't have the issue of having multiple elements with the same id on the > page. > > Jason > > On Thu, Jan 19, 2017, 06:38 Steven Silvester <[email protected] > <javascript:>> wrote: > >> Hi Björn, >> >> You can combine the HTML and JavaScript into `_repr_html_`: >> >> >> ``` >> class MyCircle(object): >> >> def __init__(self, center=(0.0,0.0), radius=1.0, color='blue'): >> self.center = center >> self.radius = radius >> self.color = color >> >> def _repr_html_(self): >> return ''' >> <canvas id='mycircle'/> >> <script> >> var c = document.getElementById("mycircle"); >> var ctx = c.getContext("2d"); >> ctx.beginPath(); >> ctx.arc(100, 75, {}, 0, 2 * Math.PI); >> ctx.stroke(); >> </script>'''.format(self.radius) >> >> def _repr_svg_(self): >> return """<svg width="100px" height="100px"> >> <circle cx="50" cy="50" r="20" stroke="black" stroke-width="1" >> fill="blue"/> >> </svg>""" >> >> def _repr_latex_(self): >> return r"$\bigcirc \LaTeX$" >> ``` >> >> >> On Sunday, January 15, 2017 at 10:28:32 AM UTC-6, Björn Johansson wrote: >>> >>> Hi, I would like to add a javascript representation to the class below. >>> I would like to have a circle drawn on a HTML5 canvas. Is this even >>> possible? The code below does not work and I do not know very much >>> javascript. I would be grateful for help. The code below executes, but >>> nothing is drawn in the cell. I have looked at the ipywidgets >>> <https://github.com/ipython/ipywidgets>, but it is not clear to me how >>> to modify the code below. >>> >>> *class MyCircle(object):* >>> >>> * def __init__(self, center=(0.0,0.0), radius=1.0, color='blue'):* >>> * self.center = center* >>> * self.radius = radius* >>> * self.color = color* >>> >>> * def _repr_html_(self):* >>> * return "○ (<b>html</b>)"* >>> >>> * def _repr_svg_(self):* >>> * return """<svg width="100px" height="100px">* >>> * <circle cx="50" cy="50" r="20" stroke="black" >>> stroke-width="1" fill="blue"/>* >>> * </svg>"""* >>> >>> * def _repr_latex_(self):* >>> * return r"$\bigcirc \LaTeX$"* >>> >>> * def _repr_javascript_(self): * >>> * s=( 'var canvas = document.createElement("canvas");' * >>> * 'canvas.height= 400;'* >>> * 'canvas.width = 400;'* >>> * 'var context = canvas.getContext("2d");'* >>> * 'document.body.appendChild(canvas);')* >>> * return s* >>> >> -- >> You received this message because you are subscribed to the Google Groups >> "Project Jupyter" group. >> To unsubscribe from this group and stop receiving emails from it, send an >> email to [email protected] <javascript:>. >> To post to this group, send email to [email protected] >> <javascript:>. >> To view this discussion on the web visit >> https://groups.google.com/d/msgid/jupyter/906c60db-c0cf-44a7-aa6f-23f664198265%40googlegroups.com >> >> <https://groups.google.com/d/msgid/jupyter/906c60db-c0cf-44a7-aa6f-23f664198265%40googlegroups.com?utm_medium=email&utm_source=footer> >> . >> For more options, visit https://groups.google.com/d/optout. >> > -- You received this message because you are subscribed to the Google Groups "Project Jupyter" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To post to this group, send email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/jupyter/a3242bd7-381a-4bde-8c3f-ebd850a09bfb%40googlegroups.com. For more options, visit https://groups.google.com/d/optout.
