[IPython-dev] experiment - remote execution of jquery and d3 code into the browser via ipython

[fawce]

On Mar 19, 2012, at 8:51 PM, Brian Granger wrote:

> On Mon, Mar 19, 2012 at 5:27 PM, hugo <hugo at continuum.io> wrote:
>> ah - interesting, I didn't quite understand it at first.
>> 
>> I think that would work, however in the d3 case, I think performance
>> would be an issue, d3 uses callbacks for everything.  for a scatter
>> plot, each circle needs at least 2 callbacks, one for x coordinate, one
>> for y coordinate, that would be one round trip communication per point!
>> for local work, this might be ok, but it probably won't work in a
>> traditional client server setup, especially if you get many points.
>> 
>> I think for me - the complexity involved in this is enough to convince
>> me that this is the wrong approach.  It was an interesting experiment
>> but I'm going to give up on this path, I think a preferable route is to
>> implement higher level plots (scatter, lines, image plots, etc..) which
>> only take json serialiseable data as args, and then just call those from
>> ipython.
> 
> I strongly agree with this assessment.  In general we are -1 on adding
> new web socket connections and trying to manage Javascript/Python
> communications at a fine grained level.  Things like interactive plots
> should simply take JSON data at the beginning and they work with it on
> the client side.

Sorry for the poor suggestion, I just didn't know d3 was so chatty.
Highcharts works the way you're suggesting, and also has good support for incrementally adding data. It is a very nice library, and we're pushing a lot of updates to it via websockets.  The tradeoff, which I think comes with the high-level chart design, is that you sacrifice flexibility in the rendering -- you can only use the chart types that exist in the library.

> 
> 
>>> 
>>> fawce's suggestion sounds very intriguing--make the websockets message
>>> passing two-way between python and javascript.  The way I understand the
>>> suggestion, what about (in python):
>>> 
>>> def mycallback(d):
>>>       return d3.axis(d['x'])
>>> 
>>> d3.selectAll('circle').attr('cx', callback(mycallback));
>>> 
>>> This gets translated to the javascript code:
>>> 
>>> d3.selectAll('circle'.attr('cx', function(){
>>> var results= send_message('mycallback', arguments);
>>> return interpret_results(results);})
>>> 
>>> send_message sends a message back through websockets to call the
>>> mycallback python function with some sort of proxy object d that knows
>>> how to generate json messages describing the attribute accesses, etc.
>>> In the python side, inside mycallback, d['x'] generates the javascript
>>> code to access arguments[0]['x'], so what is passed back is some sort of
>>> javascript code like 'd3.axis(arguments[0]['x'])'.  interpret_results
>>> then runs this code and returns the result.
>>> 
>>> Thanks,
>>> 
>>> Jason
>>> _______________________________________________
>>> IPython-dev mailing list
>>> IPython-dev at scipy.org
>>> http://mail.scipy.org/mailman/listinfo/ipython-dev
>> 
>> _______________________________________________
>> IPython-dev mailing list
>> IPython-dev at scipy.org
>> http://mail.scipy.org/mailman/listinfo/ipython-dev
> 
> 
> 
> -- 
> Brian E. Granger
> Cal Poly State University, San Luis Obispo
> bgranger at calpoly.edu and ellisonbg at gmail.com
> _______________________________________________
> IPython-dev mailing list
> IPython-dev at scipy.org
> http://mail.scipy.org/mailman/listinfo/ipython-dev