You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: content/contact/index.md
+2-23Lines changed: 2 additions & 23 deletions
Original file line number
Diff line number
Diff line change
@@ -9,7 +9,7 @@ sections:
9
9
content:
10
10
title: Contact
11
11
text: |-
12
-
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer tempus augue non tempor egestas. Proin nisl nunc, dignissim in accumsan dapibus, auctor ullamcorper neque. Quisque at elit felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Aenean eget elementum odio. Cras interdum eget risus sit amet aliquet. In volutpat, nisl ut fringilla dignissim, arcu nisl suscipit ante, at accumsan sapien nisl eu eros.
Copy file name to clipboardExpand all lines: content/posts/20-12-01-wowchemy-prize/index.md
+1-2Lines changed: 1 addition & 2 deletions
Original file line number
Diff line number
Diff line change
@@ -1,12 +1,11 @@
1
1
---
2
2
title: Exploring Network Visualization in Jupyter Notebooks
3
3
date: 2024-01-12
4
+
authors: ["namita_shah", "admin"]
4
5
---
5
6
6
7
Exploring Network Visualization in Jupyter Notebooks: A Comparison of ipycytoscape and ipysigma
7
8
8
-
9
-
10
9
## INTRODUCTION
11
10
12
11
In the realm of data science and network analysis, Jupyter Notebooks have become an increasingly popular platform for exploring and visualizing complex relationships. When dealing with large datasets, we'll compare two prominent network visualization libraries for Jupyter Notebooks—ipycytoscape and ipysigma—in the context of our use case.
Copy file name to clipboardExpand all lines: content/posts/20-12-02-ICML-best-paper/index.md
+8-45Lines changed: 8 additions & 45 deletions
Original file line number
Diff line number
Diff line change
@@ -3,56 +3,23 @@ title: IPyWidgets v Dash for GUI Image Processing
3
3
date: 2023-12-02
4
4
image:
5
5
focal_point: 'top'
6
+
authors: ["david_costello", "admin"]
6
7
---
7
8
8
-
### Paragraph 1
9
-
10
-
##### Outline
11
-
12
-
Setup the need for using a graphical user interface to process an image (drag and drop, etc...) as mouse manipulation is more intuitive than keyboard manipulation in many cases.
13
-
14
-
##### Paragraph
9
+
### Introduction
15
10
16
11
During Summer 2023, I was working on a research project. I was trying to create a piece of software that would allow the user to take in a Greek Manuscript, like [this one](https://digital.bodleian.ox.ac.uk/objects/403c2c20-5072-4ad2-831d-a43edbdfcf47/surfaces/ec0c1ff3-8d5a-4d55-bcc5-5a02963adc34/), and then, using the software, produce a computer-generated transcription of the text inside, a classic [Optical Character Recognition problem](https://en.wikipedia.org/wiki/Optical_character_recognition). Because there's not just one set of tools to do this work, I wanted to collect them all under one software umbrella. In theory, it would be an end-to-end experience that would allow users to process images for an OCR engine, like [Tesseract](https://en.wikipedia.org/wiki/Tesseract_(software)), to both train on and transcribe without the software user having to ever write a single line of code. Therefore, it seemed best to create a Graphical User Interface so that users could actually 'interact' with images through the software while using Python code to do the computational work needed. In order to create the GUI using Python, I needed a simple library that could do a lot of the heavy lifting for me. That's why I started programming with the IPyWidgets library.
17
12
18
-
### Paragraph 2
19
-
20
-
##### Outline
21
-
22
-
Explain IPyWidgets
23
-
24
-
- open source
25
-
- simple bootstrap components with community developed widgets
26
-
- integrated well with some libraries (HoloViz, Voila, etc...)
27
-
- meant to operate as Python code
28
-
29
-
##### "Paragraph"
30
-
13
+
### IPyWidgets
31
14
There were a lot of reasons to use the [IPyWidgets](https://ipywidgets.readthedocs.io/en/stable/) library. Using IPyWidgets, I could create a GUI that would run on pretty much any system that was able to run an internet browser. This is because IPyWidgets is built off of the main languages for Web Development: JavaScript, HTML, and CSS. Several things that are done by these languages are wrapped for Python use in the IPyWidgets library and are able to run with a live Python kernel, meaning that users can click buttons and tweak some sliders while a Python script can take those changes as inputs and give the user an immediate result. This means that IPyWidgets is a wonderful plug-and-play library for developers who are new to GUI development, which I was at the time. However, there were some hiccups.
32
15
33
16
#### Model View Controller Digression
34
17
35
18
> One of the most common patterns for developing software applications with a graphical interface is the Model-View-Controller ( or MVC) pattern. Any application developed with this pattern in mind separates the application into three components with different purposes. The *model* handles data structures and data manipulations. The *view* is what the user sees and interacts with. The *controller* is the part of the application that allows the model and the view components to communicate with each other, sort of like a switchboard operator receiving a call and making sure the right recipient is connected to it. An example would be a video game where users, viewing a gameplay scenario, input commands to move a character and the model, ordered by the controller, updates the view after doing the necessary computation to change what the environment looks like during movement. If you want to learn more about this software pattern, you can start [here](https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller).
36
19
37
-
The centerpiece of my application is the interactive image processing. Python has several libraries which are good for non-interactive image processing such as [OpenCV](https://opencv.org/) and [PIL](https://pillow.readthedocs.io/en/stable/). Beyond the functionality in these libraries, I wanted users to be able to draw a line over text in a manuscript image and then associate the coordinates of that line with a manual transcription to create training data for Tesseract to use. **[THIS IS WHERE AN IMAGE IS NEEDED]** Using the model-view-controller pattern, I wanted the lines drawn over the image, as a change in view, to be connected to the controller that could then cause a change in the model to store data. However, this was not possible with IPyWidgets. There is [a widget](https://ipywidgets.readthedocs.io/en/stable/examples/Widget%20List.html#image) in the IPyWidgets library that displays an image but does not allow users to draw on the image. There was an [interactive graph element](https://holoviews.org/reference/streams/bokeh/BoxEdit.html) compatible with IPyWidgets that could be hooked into the application controller that could theoretically use an image as a background element, but, due to an unfixed bug, I could not make the element work. After trying out multiple different libraries, I settled on [Dash](https://dash.plotly.com/) because it had a [robust web element](https://dash.plotly.com/annotations) capable of allowing users to annotate images and accessing that annotation with the application controller while the application was running. So I needed to learn the new library.
20
+
The centerpiece of my application is the interactive image processing. Python has several libraries which are good for non-interactive image processing such as [OpenCV](https://opencv.org/) and [PIL](https://pillow.readthedocs.io/en/stable/). Beyond the functionality in these libraries, I wanted users to be able to draw a line over text in a manuscript image and then associate the coordinates of that line with a manual transcription to create training data for Tesseract to use. <!---**[THIS IS WHERE AN IMAGE IS NEEDED]** --> Using the model-view-controller pattern, I wanted the lines drawn over the image, as a change in view, to be connected to the controller that could then cause a change in the model to store data. However, this was not possible with IPyWidgets. There is [a widget](https://ipywidgets.readthedocs.io/en/stable/examples/Widget%20List.html#image) in the IPyWidgets library that displays an image but does not allow users to draw on the image. There was an [interactive graph element](https://holoviews.org/reference/streams/bokeh/BoxEdit.html) compatible with IPyWidgets that could be hooked into the application controller that could theoretically use an image as a background element, but, due to an unfixed bug, I could not make the element work. After trying out multiple different libraries, I settled on [Dash](https://dash.plotly.com/) because it had a [robust web element](https://dash.plotly.com/annotations) capable of allowing users to annotate images and accessing that annotation with the application controller while the application was running. So I needed to learn the new library.
38
21
39
-
### Paragraph 3(?)
40
-
41
-
##### Outline
42
-
43
-
Explain Dash
44
-
45
-
- privately owned and developed
46
-
- provides python shell for javascript and html
47
-
- integrated with the open source plotly library
48
-
- meant to operate without global variables
49
-
50
-
Describe problems and solutions
51
-
52
-
- callback functions forcing updates automatically - global variables
53
-
- stateless paradigm making it difficult to save data - dummy output
54
-
55
-
##### Paragraph
22
+
### Dash
56
23
57
24
Dash is owned and maintained by Plotly, a company that makes its money by selling licenses for the Enterprise version of Dash. Because of this, Dash is a very well maintained library that has limited integrations with other Python libraries. Unfortunately, IPyWidgets is not one of the libraries compatible with Dash. Though Dash is similar to IPyWidgets, in that it wraps HTML, JavaScript, and CSS for use in Python scripts, it has some differences. One big difference is that an application built using Dash has to run on a server, whether that is a local server or a remote server. Further, Dash is meant to be used with a *stateless* approach for web applications. In abstract, a web application built with a stateless approach is run on a server where the server processes user requests and input and returns an output without the server saving any of the data sent by the user or any of the output generated by the server. In practice, this stateless approach meant that Dash did not handle global variables in Python very well and it required a few creative workarounds. Considering that I was trying to create locally stored data using my application, the lack of saving within the server proved to be very difficult to work with. All of the code I had already developed needed to be ported over into the Dash context.
58
25
@@ -64,21 +31,17 @@ There were two main problems that I had when porting my pre-existing code to the
64
31
65
32
- global variables to avoid forcing updates and callbacks
66
33
- dummy output for callbacks not intended to affect the view
67
-
-
68
34
69
-
### Paragraph 4(?)
70
35
71
-
##### Outline
36
+
###Dash vs. IPyWidgets
72
37
73
-
Why Dash over IPyWidgets?
38
+
##### Why Dash over IPyWidgets?
74
39
75
40
- Dash had a useful widget that I needed while IPyWidgets did not
76
41
- IPyWidgets is more restrictive in its layout and styling
77
42
- Dash is privately maintained, so many elements of it are likely to just work together
78
43
79
-
##### Paragraph
80
-
81
-
Why IPyWidgets is still worth considering
44
+
##### Why IPyWidgets is still worth considering
82
45
83
46
- The Python focus is more in line with certain use cases, especially in research contexts, where the stateless paradigm is unnecessarily obtuse and, in fact, difficult to program with it in mind
84
47
- Dash is a walled garden in some sense, keeping its integrations pretty tightly controlled while IPyWidgets has a lot of possible interconnections that Dash just doesn't
Copy file name to clipboardExpand all lines: content/publication/shah-23/index.md
+3Lines changed: 3 additions & 0 deletions
Original file line number
Diff line number
Diff line change
@@ -9,3 +9,6 @@ publication: "US-RSE Conference"
9
9
doi: "10.5281/zenodo.10645467"
10
10
---
11
11
12
+
### Abstract:
13
+
14
+
Researchers are increasingly using web applications to promote their work in an accessible and engaging format. By leveraging interactive visualizations and intuitive interfaces, researchers can effectively share their data and code within the scientific community. RSEs may be interested in working with researchers to build web applications that have the potential to improve code and data reuse. Despite the value of these communication tools, maintaining them eventually falls to the researchers who are not incentivized to learn new tools and technologies. We present a network analysis visualization tool that is demonstrative of how an existing research workflow in a Jupyter Notebook can be transformed into complex web applications without leaving the JupyterLab development environment. This application uses Jupyter widgets (ipywidgets) to add interactive components - such as buttons, dropdown menus - and a network visualization widget (ipycytoscape) to visually explore and analyze a large citation network. Voila strips away code cells, leaving behind only interactive browser components, resulting in a fully-fledged user interface. By adapting existing workflows, researchers working with RSEs can benefit from the familiarity of the codebase and the development environment. This helps them maintain the application beyond the period of collaboration. Based on our experience, we recommend that researchers and RSEs consider the adoption of Jupyter Notebook and Jupyter widgets to transform existing workflows into intuitive, interactive, and aesthetic web applications that can effectively communicate their research findings.
0 commit comments