Feature: add two tools in barchart toolbox (table view and latex view)

[noelchen90]

Related to #426 UI Optimization Plan

18. It would be nice if statistics existing in these histograms could be exported.

New Feature

This PR adds two tools in the bar chart toolbox.

1. barchart in Tex format
2. table view

These two buttons will open up LatexViewModal and TableViewModal respectively. Screenshots are shown below.

Screenshot of LatexViewModal and TableViewModal

Comments

In LaTex, I added legend style={at={(0.5,-0.2)},anchor=north,legend cell align=left},to place the legend at the bottom. I also added the following lines to remove the second bar in legend. The screenshots of the before and after are shown below. The after screenshot is also the compiled graph you would see in latex.

\pgfplotsset{
    legend image code/.code={
        \draw [#1] (0cm,-0.1cm) rectangle (0.6cm,0.1cm);
    },
}

[pfliu-nlp]

@noelchen90 Hi, just a quick comment: could we also make this table exportable as a file such as excel? The reason is sometimes users must want to get the table data, and they will draw based on it using tools they are familiar with.

[noelchen90]

After an offline discussion with @lyuyangh, we decided to roll back to "text" for the codeblock. The Unhandled Rejection (Error): Language tex not supported error that pops up during dev also pops up in production. And it also doesn't show any syntax highlighting in production as well. react-code-blocks seems like a loosely maintained repo, with a lot of similar opened issues. We may need to find another package that supports latex + python syntax highlighting in the future.

[noelchen90]

@lyuyangh Hmm, I don't see that error from my end. I added rowKey for each item in my data source after your previous recommendations, I thought that already solved the problem. Have you pulled my latest commits?

https://github.com/neulab/explainaboard_web/blob/feat/export-latex/frontend/src/components/Analysis/BarChart/TableViewModal.tsx#L54