Repository: evidentlyai/evidently
Issue: Evidently UI is not working with Custom Metric
Root cause: Documentation Deficiency

I am trying to launch the custom metric into evidently UI. I have used the same custom metric creation which is being provided and exposing the same report and test suite ... It is showing

 

INFO:     Application startup complete.

INFO:     Uvicorn running on http://0.0.0.0:8000/ (Press CTRL+C to quit)

fatal: not a git repository (or any of the parent directories): .git

INFO:     [127.0.0.1:54723](http://127.0.0.1:54723/) - "GET /api/version HTTP/1.1" 200 OK

INFO:     [127.0.0.1:54724](http://127.0.0.1:54724/) - "GET /api/projects HTTP/1.1" 500 Internal Server Error

 

without further info... How to resolve it ?

 

The metric is working in notebook scope... I am attaching the notebook and screenshots, and working on other machine as well.

<img width="1060" alt="Image" src="https://github.com/user-attachments/assets/4f4b43c1-b309-4aee-8f83-39453e611e58" />
<img width="926" alt="Image" src="https://github.com/user-attachments/assets/21c1f296-3d66-4b23-90e6-aac95345ffd2" />

[how_to_make_… (4) - JupyterLab.pdf](https://github.com/user-attachments/files/18450512/how_to_make_.4.-.JupyterLab.pdf)

Hi @sachincse, 

it is not currently possible to render metric with a custom render in the UI. If you want to use the custom Metric with the UI, you need to implement it as a Python function.

Check the docs here (option 1): https://docs.evidentlyai.com/user-guide/customization/add-custom-metric-or-test
 
However, there is an upcoming API update with the new Metric archirecture that will allow for this.

Hey @elenasamuylova,

I tried the above custom metric notebook, it worked. If I want to add a Plotly graph to this metric, How can i do it??

Below is the code I tried:

generate_graph function creates 
```
from evidently.renderers.html_widgets import plotly_figure
def LE_graph(data: InputData):
          bar_width = 0.2
          desired_order, value_counts_by_buid, curr_data = generate_graph(data.current_data)
          positions = np.arange(len(desired_order))
          fig = go.Figure() 
          for i, (buid, counts) in enumerate(value_counts_by_buid.iterrows()):
              fig.add_trace(
                  go.Bar(
                      x=[p + i * bar_width for p in positions],
                      y=counts,
                      width=bar_width,
                      name=buid,
                      marker_color='red' 
                  ))

            x_ticks = [p + bar_width * (len(value_counts_by_buid) - 1) / 2 for p in positions]
            fig.update_layout(
                xaxis=dict(
                    tickmode='array',
                    tickvals=x_ticks,
                    ticktext=desired_order
                ),
                title='Results by BuId',
                xaxis_title='Category',
                yaxis_title='Percentage',
                barmode='group', 
                legend_title='BuId'
            )
        return plotly_figure(title="Example plot", figure=fig)

data_drift_dataset_report = Report(metrics=[
            CustomValueMetric(func=r2_func, title="Current: R2 score", size=WidgetSize.HALF),
            CustomValueMetric(func=variance_func, title="Current: Variance", size=WidgetSize.HALF),
            CustomValueMetric(func=LE_graph, title="Graph")
 ])```

Error:
  ValidationError: 1 validation error for CustomCallableMetricResult value
  value is not a valid float (type=type_error.float)