Plotly 6.0.0 with Flask app no longer displays plot data with base 64 encoding

[ParfaitG]

Using the latest Plotly v6.0.0, my Flask web application no longer correctly displays a Plotly figure. While axes, background, and title renders, the plot displays an empty region with no data where a set of lines should be. The Flask UI receives a JSON string of a Plotly figure using json.dumps(fig, cls=plotly.utils.PlotlyJSONEncoder).

Comparing between prod (v5.24.1) and dev (6.0.0) version of app shows embedded base64 encoding in bdata elements within the JSON content. And release notes indicate the following changes:

Update plotly.py to use base64 encoding of typed arrays e.g. numpy in plotly JSON to keep precision intact and improve performance #4470.

With this update, should I use a different class other than PlotlyJSONEncoder for JSON string rendering of Plotly figures?

Reproducible Example

Python

import json
import pandas as pd
import plotly
import plotly.graph_objects as go

mexico_frame = pd.DataFrame({'year': {0: 2015, 1: 2016, 2: 2017, 3: 2018, 4: 2019, 5: 2020, 6: 2021, 7: 2022, 8: 2015, 9: 2016, 10: 2017, 11: 2018, 12: 2019, 13: 2020, 14: 2021, 15: 2022, 16: 2015, 17: 2016, 18: 2017, 19: 2018, 20: 2019, 21: 2020, 22: 2021, 23: 2022, 24: 2015, 25: 2016, 26: 2017, 27: 2018, 28: 2019, 29: 2020, 30: 2021, 31: 2022, 32: 2015, 33: 2016, 34: 2017, 35: 2018, 36: 2019, 37: 2020, 38: 2021, 39: 2022, 40: 2015, 41: 2016, 42: 2017, 43: 2018, 44: 2019, 45: 2020, 46: 2021, 47: 2022, 48: 2015, 49: 2016, 50: 2017, 51: 2018, 52: 2019, 53: 2020, 54: 2021, 55: 2022}, 'iso2': {0: 'MX', 1: 'MX', 2: 'MX', 3: 'MX', 4: 'MX', 5: 'MX', 6: 'MX', 7: 'MX', 8: 'MX', 9: 'MX', 10: 'MX', 11: 'MX', 12: 'MX', 13: 'MX', 14: 'MX', 15: 'MX', 16: 'MX', 17: 'MX', 18: 'MX', 19: 'MX', 20: 'MX', 21: 'MX', 22: 'MX', 23: 'MX', 24: 'MX', 25: 'MX', 26: 'MX', 27: 'MX', 28: 'MX', 29: 'MX', 30: 'MX', 31: 'MX', 32: 'MX', 33: 'MX', 34: 'MX', 35: 'MX', 36: 'MX', 37: 'MX', 38: 'MX', 39: 'MX', 40: 'MX', 41: 'MX', 42: 'MX', 43: 'MX', 44: 'MX', 45: 'MX', 46: 'MX', 47: 'MX', 48: 'MX', 49: 'MX', 50: 'MX', 51: 'MX', 52: 'MX', 53: 'MX', 54: 'MX', 55: 'MX'}, 'country': {0: 'Mexico', 1: 'Mexico', 2: 'Mexico', 3: 'Mexico', 4: 'Mexico', 5: 'Mexico', 6: 'Mexico', 7: 'Mexico', 8: 'Mexico', 9: 'Mexico', 10: 'Mexico', 11: 'Mexico', 12: 'Mexico', 13: 'Mexico', 14: 'Mexico', 15: 'Mexico', 16: 'Mexico', 17: 'Mexico', 18: 'Mexico', 19: 'Mexico', 20: 'Mexico', 21: 'Mexico', 22: 'Mexico', 23: 'Mexico', 24: 'Mexico', 25: 'Mexico', 26: 'Mexico', 27: 'Mexico', 28: 'Mexico', 29: 'Mexico', 30: 'Mexico', 31: 'Mexico', 32: 'Mexico', 33: 'Mexico', 34: 'Mexico', 35: 'Mexico', 36: 'Mexico', 37: 'Mexico', 38: 'Mexico', 39: 'Mexico', 40: 'Mexico', 41: 'Mexico', 42: 'Mexico', 43: 'Mexico', 44: 'Mexico', 45: 'Mexico', 46: 'Mexico', 47: 'Mexico', 48: 'Mexico', 49: 'Mexico', 50: 'Mexico', 51: 'Mexico', 52: 'Mexico', 53: 'Mexico', 54: 'Mexico', 55: 'Mexico'}, 'metric_id': {0: 9, 1: 9, 2: 9, 3: 9, 4: 9, 5: 9, 6: 9, 7: 9, 8: 9, 9: 9, 10: 9, 11: 9, 12: 9, 13: 9, 14: 9, 15: 9, 16: 9, 17: 9, 18: 9, 19: 9, 20: 9, 21: 9, 22: 9, 23: 9, 24: 9, 25: 9, 26: 9, 27: 9, 28: 9, 29: 9, 30: 9, 31: 9, 32: 9, 33: 9, 34: 9, 35: 9, 36: 9, 37: 9, 38: 9, 39: 9, 40: 9, 41: 9, 42: 9, 43: 9, 44: 9, 45: 9, 46: 9, 47: 9, 48: 9, 49: 9, 50: 9, 51: 9, 52: 9, 53: 9, 54: 9, 55: 9}, 'metric': {0: 'Ecological Footprint per person', 1: 'Ecological Footprint per person', 2: 'Ecological Footprint per person', 3: 'Ecological Footprint per person', 4: 'Ecological Footprint per person', 5: 'Ecological Footprint per person', 6: 'Ecological Footprint per person', 7: 'Ecological Footprint per person', 8: 'Ecological Footprint per person', 9: 'Ecological Footprint per person', 10: 'Ecological Footprint per person', 11: 'Ecological Footprint per person', 12: 'Ecological Footprint per person', 13: 'Ecological Footprint per person', 14: 'Ecological Footprint per person', 15: 'Ecological Footprint per person', 16: 'Ecological Footprint per person', 17: 'Ecological Footprint per person', 18: 'Ecological Footprint per person', 19: 'Ecological Footprint per person', 20: 'Ecological Footprint per person', 21: 'Ecological Footprint per person', 22: 'Ecological Footprint per person', 23: 'Ecological Footprint per person', 24: 'Ecological Footprint per person', 25: 'Ecological Footprint per person', 26: 'Ecological Footprint per person', 27: 'Ecological Footprint per person', 28: 'Ecological Footprint per person', 29: 'Ecological Footprint per person', 30: 'Ecological Footprint per person', 31: 'Ecological Footprint per person', 32: 'Ecological Footprint per person', 33: 'Ecological Footprint per person', 34: 'Ecological Footprint per person', 35: 'Ecological Footprint per person', 36: 'Ecological Footprint per person', 37: 'Ecological Footprint per person', 38: 'Ecological Footprint per person', 39: 'Ecological Footprint per person', 40: 'Ecological Footprint per person', 41: 'Ecological Footprint per person', 42: 'Ecological Footprint per person', 43: 'Ecological Footprint per person', 44: 'Ecological Footprint per person', 45: 'Ecological Footprint per person', 46: 'Ecological Footprint per person', 47: 'Ecological Footprint per person', 48: 'Ecological Footprint per person', 49: 'Ecological Footprint per person', 50: 'Ecological Footprint per person', 51: 'Ecological Footprint per person', 52: 'Ecological Footprint per person', 53: 'Ecological Footprint per person', 54: 'Ecological Footprint per person', 55: 'Ecological Footprint per person'}, 'note': {0: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 1: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 2: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 3: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 4: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 5: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 6: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 7: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 8: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 9: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 10: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 11: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 12: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 13: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 14: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 15: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 16: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 17: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 18: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 19: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 20: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 21: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 22: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 23: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 24: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 25: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 26: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 27: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 28: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 29: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 30: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 31: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 32: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 33: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 34: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 35: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 36: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 37: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 38: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 39: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 40: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 41: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 42: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 43: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 44: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 45: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 46: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 47: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 48: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 49: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 50: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 51: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 52: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 53: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 54: 'Ecological Footprint of consumption in global hectares (gha) divided by population', 55: 'Ecological Footprint of consumption in global hectares (gha) divided by population'}, 'footprint_type': {0: 'builtupLand', 1: 'builtupLand', 2: 'builtupLand', 3: 'builtupLand', 4: 'builtupLand', 5: 'builtupLand', 6: 'builtupLand', 7: 'builtupLand', 8: 'carbon', 9: 'carbon', 10: 'carbon', 11: 'carbon', 12: 'carbon', 13: 'carbon', 14: 'carbon', 15: 'carbon', 16: 'cropLand', 17: 'cropLand', 18: 'cropLand', 19: 'cropLand', 20: 'cropLand', 21: 'cropLand', 22: 'cropLand', 23: 'cropLand', 24: 'fishingGround', 25: 'fishingGround', 26: 'fishingGround', 27: 'fishingGround', 28: 'fishingGround', 29: 'fishingGround', 30: 'fishingGround', 31: 'fishingGround', 32: 'forestLand', 33: 'forestLand', 34: 'forestLand', 35: 'forestLand', 36: 'forestLand', 37: 'forestLand', 38: 'forestLand', 39: 'forestLand', 40: 'grazingLand', 41: 'grazingLand', 42: 'grazingLand', 43: 'grazingLand', 44: 'grazingLand', 45: 'grazingLand', 46: 'grazingLand', 47: 'grazingLand', 48: 'total', 49: 'total', 50: 'total', 51: 'total', 52: 'total', 53: 'total', 54: 'total', 55: 'total'}, 'footprint_value': {0: 0.06998590647491501, 1: 0.07470568681825901, 2: 0.08089834521584001, 3: 0.08131535835414301, 4: 0.08437062872542, 5: 0.081877766078983, 6: 0.08226062967613301, 7: 0.08256117303348401, 8: 1.45299322354663, 9: 1.39674909997343, 10: 1.39675783668407, 11: 1.30509984067737, 12: 1.28630084494473, 13: 1.03612887068416, 14: 1.18958351222326, 15: 1.14254018173385, 16: 0.5597860304132211, 17: 0.5790942193074811, 18: 0.571234212047664, 19: 0.5711844221103021, 20: 0.560660759884935, 21: 0.49932535845387405, 22: 0.496539177731512, 23: 0.49342762983491606, 24: 0.116064280674846, 25: 0.11975863871968, 26: 0.11903431489980601, 27: 0.11361905819041701, 28: 0.10693797175441101, 29: 0.10230798395573201, 30: 0.10173711662881701, 31: 0.101099584032299, 32: 0.260319967669921, 33: 0.26654267401659404, 34: 0.281096560106174, 35: 0.278314696587597, 36: 0.26435168814146504, 37: 0.267845144452164, 38: 0.266350597929709, 39: 0.26468151987924904, 40: 0.23192434947102, 41: 0.23252356700818103, 42: 0.22898262872433803, 43: 0.222846437626832, 44: 0.21798902382889102, 45: 0.20332102496109902, 46: 0.202186515946873, 47: 0.200919520195826, 48: 2.69107375825056, 49: 2.66937388584362, 50: 2.67800389767789, 51: 2.57237981354666, 52: 2.52061091727985, 53: 2.19080614858601, 54: 2.3386575501363, 55: 2.28522960870963}})

def build_graph(frame: pd.DataFrame) -> str:
    trace = go.Scatter(
        x=frame.query("footprint_type == 'total'")["year"],
        y=frame.query("footprint_type == 'total'")["footprint_value"],
        dx=1,
        dy=1,
        text=frame.query("footprint_type == 'total'")["footprint_type"],
        name="total",
        mode="lines+markers",
        hoverinfo="x+y+text",
        textposition="top center",
        marker=dict(showscale=False, size=2, line_width=0),
    )

    layout = go.Layout(
        title=dict(
            text=f'{frame["country"].iat[0]}: {frame["metric"].iat[0]}',
            font_size=16
        ),
        showlegend=False,
        hovermode="closest",
        margin=dict(b=20, l=5, r=5, t=40),
        title_x=0.5,
        font_family="Arial",
        title_font_family="Arial",
        legend_title_font_family="Arial",
        yaxis=dict(tickformat=".2f"),
        annotations=[
            dict(
                text=frame["note"].iat[0],
                showarrow=False,
                xref="paper",
                yref="paper",
                x=0.0,
                y=-0.1,
            )
        ],
    )

    fig = go.Figure(data=[trace], layout=layout)

    for ftype in [
        "builtupLand",
        "cropLand",
        "forestLand",
        "fishingGround",
        "grazingLand",
        "carbon",
    ]:
        q = "footprint_type == @ftype"
        fig.add_trace(
            go.Scatter(
                x=frame.query(q)["year"],
                y=frame.query(q)["footprint_value"],
                text=frame.query(q)["footprint_type"],
                hoverinfo="x+y+text",
                name=(ftype.replace("Land", " land").replace("Ground", " ground")),
                mode="lines+markers",
                connectgaps=True,
                marker=dict(showscale=False, size=2, line_width=0),
            )
        )

    fig.update_layout(
        showlegend=True,
        legend=dict(orientation="h", xanchor="center", yanchor="top", x=0.5, y=1.0),
        margin=dict(l=20, r=20, t=35, b=40),
    )
    
    return json.dumps(fig, cls=plotly.utils.PlotlyJSONEncoder)
    
print(build_graph(mexico_frame)) 

---

Production (v5.24.1) vs Development (v6.0.0)

Comparing between my production and development version of same code generates following differences viewable on https://jsfiddle.net.

Prod (no issue with desired plot display)

HTML

<body>
  <div id="cons-footprint-plot" class="chart"></div>
</body>

JS

var graphs = {"data": [{"dx": 1, "dy": 1, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "total", "text": ["total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total"], "textposition": "top center", "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [2.07630830849152, 2.00874943595944, 1.99068211445437, 2.01641382915592, 1.91629237308816, 1.9328807751123, 2.01675331932545, 2.00197643427104, 1.98674011917152, 2.1370388480144, 2.10368681058998, 2.07989181194314, 2.26105928162359, 2.37987775148131, 2.37551912379596, 2.25931223567278, 2.24999993624751, 2.321226207037, 2.42122022921399, 2.6040626570312497, 2.70161183018488, 2.50231694850833, 2.33261784868637, 2.44373322624395, 2.52960889670879, 2.3545055176894802, 2.37820010662579, 2.50396443379012, 2.5807674937113, 2.59314295364264, 2.6398760268405, 2.60358360545381, 2.6386090283306, 2.83561656481768, 2.64108842432268, 3.06268626752021, 3.03825301080676, 3.03017845674158, 4.17126059815816, 3.09137710985913, 3.5684140915108, 3.19017969374877, 2.83935084717272, 2.76359946386932, 3.02830088722433, 3.12622191610183, 3.21184358080122, 3.26084690768218, 3.00079136419209, 3.32717386995855, 2.92856662511405, 3.0615947042148, 2.81671344682771, 2.67579216065001, 2.69107375825056, 2.66937388584362, 2.67800389767789, 2.57237981354666, 2.52061091727985, 2.19080614858601, 2.3386575501363, 2.28522960870963], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "builtup land", "text": ["builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.03245943435903, 0.035854722462993004, 0.037696562575276, 0.043067257309990004, 0.048044262100798006, 0.05044532335020101, 0.050111018968271005, 0.05148680756993201, 0.052106699077198004, 0.05764138424140901, 0.057638385332446, 0.056501650060211, 0.05660039707375301, 0.05608298769311001, 0.058261944555497006, 0.053568306282318005, 0.053249345621606006, 0.061381935299485005, 0.05814714075185601, 0.06337544906204501, 0.063480415439467, 0.06239502718202101, 0.06285905569646001, 0.065678042295921, 0.068119155255598, 0.073266335968349, 0.072113296958541, 0.065916151984864, 0.064179482893038, 0.063019753049664, 0.057627820956871, 0.059628543677374, 0.060263965023301, 0.059519097295128005, 0.060723150093367005, 0.062888994513938, 0.06226645533148901, 0.065527817321574, 0.06386793488579101, 0.06138880520711801, 0.06587458822223101, 0.06170090642650101, 0.063964242402271, 0.066112322641696, 0.064519548012492, 0.065502702863102, 0.065227888940574, 0.066180795861803, 0.062827033657923, 0.06552349916918, 0.060156189114244, 0.06474202479339501, 0.070897982035673, 0.070776031370718, 0.06998590647491501, 0.07470568681825901, 0.08089834521584001, 0.08131535835414301, 0.08437062872542, 0.081877766078983, 0.08226062967613301, 0.08256117303348401], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "crop land", "text": ["cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.452156791967309, 0.437401623827649, 0.435491211292493, 0.44970668507799405, 0.395805228403656, 0.403000217154349, 0.395093638606604, 0.41960116853539303, 0.409030225950187, 0.443528327358828, 0.39484400710253903, 0.38376118452470903, 0.42183356325803806, 0.47910771012706604, 0.45932559237839105, 0.39543225281410604, 0.41734121003524, 0.455747439711351, 0.45575991036906105, 0.551784505243299, 0.5547209282273741, 0.5260750694360861, 0.556481405510321, 0.542341804606961, 0.52428462096732, 0.47711495776983304, 0.49983298409278204, 0.520269155740473, 0.544096353176941, 0.617007902716284, 0.608661284345647, 0.634871320906157, 0.626827498522688, 0.604239159722158, 0.53970609089763, 0.620829075113527, 0.611213808359173, 0.644602105635067, 0.6685671255741981, 0.683288037387149, 0.702594140815428, 0.7232754298744261, 0.71337564338948, 0.691609688235716, 0.68898066146164, 0.7065651942384381, 0.68101728434294, 0.646353060615079, 0.623116571488432, 0.619634192267799, 0.602966390873377, 0.614099340339736, 0.562242216659384, 0.5782909070030761, 0.5597860304132211, 0.5790942193074811, 0.571234212047664, 0.5711844221103021, 0.560660759884935, 0.49932535845387405, 0.496539177731512, 0.49342762983491606], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "forest land", "text": ["forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.30677745901062103, 0.31181862726204, 0.311419598296234, 0.31092310436388704, 0.30970054324073404, 0.300671477145809, 0.306402758779025, 0.301351216078916, 0.300912327208593, 0.31213730668424705, 0.288417674195728, 0.28411565436052, 0.283549717043161, 0.296193678620753, 0.29113672084394504, 0.29032198118531305, 0.29135606604824704, 0.248680367370458, 0.255729546522319, 0.270388792374382, 0.263824950653655, 0.26140157313912205, 0.255756569480734, 0.253018088410952, 0.25744747869871604, 0.25322416525233604, 0.255533159519767, 0.254187989404117, 0.254430620465601, 0.249409769395901, 0.24838166455194502, 0.250679143716281, 0.260265522527152, 0.25584634005239903, 0.253600395918512, 0.238567019127905, 0.24829888730425, 0.26145695692049703, 0.280439572466678, 0.298436364900723, 0.270390787453117, 0.26697233433362805, 0.278820743862979, 0.296174475452467, 0.29637481267693805, 0.32267097989422705, 0.33006737994599905, 0.30966946904889303, 0.25538300463394303, 0.26604556198962603, 0.26068257129676303, 0.26054260942533203, 0.263152603632694, 0.259893532118525, 0.260319967669921, 0.26654267401659404, 0.281096560106174, 0.278314696587597, 0.26435168814146504, 0.267845144452164, 0.266350597929709, 0.26468151987924904], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "fishing ground", "text": ["fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.06768302181924901, 0.073072342321714, 0.078369826675682, 0.061103913974472006, 0.05576728082959401, 0.05991677222087, 0.06336406722212401, 0.055562522039918, 0.054630626693062005, 0.05834121244092701, 0.066170873049103, 0.066914625855385, 0.074354660951644, 0.065814931650078, 0.065170594125578, 0.049979895383317006, 0.045878952389235006, 0.063021583875281, 0.07159087148817, 0.07686931598353601, 0.103809654252387, 0.077338316379104, 0.067034106459051, 0.09161903083655001, 0.08309747202211301, 0.080206741058595, 0.08418631658738601, 0.095665547939174, 0.102224917729967, 0.11095784161690901, 0.10361559048282301, 0.10166675548858, 0.10435385059089901, 0.10949293421566901, 0.11057818556939701, 0.11678618405806102, 0.122640431530773, 0.098067222840772, 0.10265946457472501, 0.09377583451638401, 0.09020873594786401, 0.097700992479558, 0.094252853079343, 0.099987392803907, 0.10415944819828701, 0.09406560657730301, 0.09783203462027601, 0.089998925873998, 0.08130273223802001, 0.08632651766987501, 0.07529423238898601, 0.07259091368602001, 0.08521256312783901, 0.10030076845829901, 0.116064280674846, 0.11975863871968, 0.11903431489980601, 0.11361905819041701, 0.10693797175441101, 0.10230798395573201, 0.10173711662881701, 0.101099584032299], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "grazing land", "text": ["grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.718966906771318, 0.694792060009722, 0.6842535958666001, 0.6923806886124411, 0.6654968809935351, 0.633390234196171, 0.6227668966084291, 0.5880741238175331, 0.557574461888787, 0.537597355411736, 0.5274734444680841, 0.499510552504809, 0.49752704403766, 0.501757542756844, 0.49743700244922806, 0.47304493996676605, 0.45238377601758506, 0.426355773168042, 0.436558393311035, 0.44319489780888405, 0.43621655087211203, 0.4179860239507, 0.41269320004922905, 0.411190657132923, 0.410060999148088, 0.382875460063196, 0.37698098879586606, 0.396697416686621, 0.394730128988998, 0.377618923762955, 0.392177190506698, 0.39603456624148103, 0.372276442343595, 0.37504071883997103, 0.32428181617709, 0.351739117739369, 0.371479264243666, 0.38184669752607603, 0.37775353751143503, 0.37931825274270004, 0.37640316153895204, 0.38466454683802803, 0.349579482908678, 0.330407605315904, 0.330753206063136, 0.326283094951332, 0.330301829675233, 0.319664556121668, 0.297972669650157, 0.276948620105034, 0.25189873207144303, 0.23690490788163102, 0.24484978007670202, 0.235630863800375, 0.23192434947102, 0.23252356700818103, 0.22898262872433803, 0.222846437626832, 0.21798902382889102, 0.20332102496109902, 0.202186515946873, 0.200919520195826], "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "carbon", "text": ["carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon"], "x": [1961, 1962, 1963, 1964, 1965, 1966, 1967, 1968, 1969, 1970, 1971, 1972, 1973, 1974, 1975, 1976, 1977, 1978, 1979, 1980, 1981, 1982, 1983, 1984, 1985, 1986, 1987, 1988, 1989, 1990, 1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998, 1999, 2000, 2001, 2002, 2003, 2004, 2005, 2006, 2007, 2008, 2009, 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022], "y": [0.498264694563995, 0.45581006007532404, 0.44345131974809, 0.45923217981713504, 0.44147817751984403, 0.48545675104489605, 0.579014939140996, 0.5859005962293461, 0.612485778353693, 0.72779326187725, 0.7691424264420781, 0.7890881446375091, 0.927193899259331, 0.980920900633459, 1.00418726944332, 0.9969648600409591, 0.9897905861355981, 1.06603910761239, 1.14343436677155, 1.1984496965591, 1.27955933073988, 1.1571209384213, 0.977793511490577, 1.07988560296064, 1.18659917061695, 1.08781785757717, 1.08955336067144, 1.17122817203487, 1.22110599045675, 1.17512876310092, 1.22941247599651, 1.16070327542394, 1.21462174932297, 1.43147831469236, 1.35219878566669, 1.6718758769674, 1.6223541640374002, 1.57867765649759, 2.67797296314534, 1.5751698151050602, 2.0629426775332, 1.65586548379663, 1.33935788152997, 1.27930797941963, 1.54351321081184, 1.6111343375774299, 1.70739716327619, 1.82898010016074, 1.68018935252361, 2.01269547875704, 1.67756850936924, 1.81271490808869, 1.5903583012954199, 1.43090005789902, 1.45299322354663, 1.39674909997343, 1.39675783668407, 1.30509984067737, 1.28630084494473, 1.03612887068416, 1.18958351222326, 1.14254018173385], "type": "scatter"}], "layout": {"annotations": [{"showarrow": false, "text": "Ecological Footprint of consumption in global hectares (gha) divided by population", "x": 0.0, "xref": "paper", "y": -0.1, "yref": "paper"}], "font": {"family": "Arial"}, "hovermode": "closest", "legend": {"title": {"font": {"family": "Arial"}}, "orientation": "h", "xanchor": "center", "yanchor": "top", "x": 0.5, "y": 1.0}, "margin": {"b": 40, "l": 20, "r": 20, "t": 35}, "showlegend": true, "title": {"font": {"family": "Arial", "size": 16}, "text": "Mexico: Ecological Footprint per person", "x": 0.5}, "template": {"data": {"histogram2dcontour": [{"type": "histogram2dcontour", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "choropleth": [{"type": "choropleth", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "histogram2d": [{"type": "histogram2d", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "heatmap": [{"type": "heatmap", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "heatmapgl": [{"type": "heatmapgl", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "contourcarpet": [{"type": "contourcarpet", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "contour": [{"type": "contour", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "surface": [{"type": "surface", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "mesh3d": [{"type": "mesh3d", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "scatter": [{"fillpattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}, "type": "scatter"}], "parcoords": [{"type": "parcoords", "line": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterpolargl": [{"type": "scatterpolargl", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "bar": [{"error_x": {"color": "#2a3f5f"}, "error_y": {"color": "#2a3f5f"}, "marker": {"line": {"color": "#E5ECF6", "width": 0.5}, "pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "bar"}], "scattergeo": [{"type": "scattergeo", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterpolar": [{"type": "scatterpolar", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "histogram": [{"marker": {"pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "histogram"}], "scattergl": [{"type": "scattergl", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatter3d": [{"type": "scatter3d", "line": {"colorbar": {"outlinewidth": 0, "ticks": ""}}, "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scattermapbox": [{"type": "scattermapbox", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterternary": [{"type": "scatterternary", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scattercarpet": [{"type": "scattercarpet", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "carpet": [{"aaxis": {"endlinecolor": "#2a3f5f", "gridcolor": "white", "linecolor": "white", "minorgridcolor": "white", "startlinecolor": "#2a3f5f"}, "baxis": {"endlinecolor": "#2a3f5f", "gridcolor": "white", "linecolor": "white", "minorgridcolor": "white", "startlinecolor": "#2a3f5f"}, "type": "carpet"}], "table": [{"cells": {"fill": {"color": "#EBF0F8"}, "line": {"color": "white"}}, "header": {"fill": {"color": "#C8D4E3"}, "line": {"color": "white"}}, "type": "table"}], "barpolar": [{"marker": {"line": {"color": "#E5ECF6", "width": 0.5}, "pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "barpolar"}], "pie": [{"automargin": true, "type": "pie"}]}, "layout": {"autotypenumbers": "strict", "colorway": ["#636efa", "#EF553B", "#00cc96", "#ab63fa", "#FFA15A", "#19d3f3", "#FF6692", "#B6E880", "#FF97FF", "#FECB52"], "font": {"color": "#2a3f5f"}, "hovermode": "closest", "hoverlabel": {"align": "left"}, "paper_bgcolor": "white", "plot_bgcolor": "#E5ECF6", "polar": {"bgcolor": "#E5ECF6", "angularaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "radialaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}}, "ternary": {"bgcolor": "#E5ECF6", "aaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "baxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "caxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}}, "coloraxis": {"colorbar": {"outlinewidth": 0, "ticks": ""}}, "colorscale": {"sequential": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]], "sequentialminus": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]], "diverging": [[0, "#8e0152"], [0.1, "#c51b7d"], [0.2, "#de77ae"], [0.3, "#f1b6da"], [0.4, "#fde0ef"], [0.5, "#f7f7f7"], [0.6, "#e6f5d0"], [0.7, "#b8e186"], [0.8, "#7fbc41"], [0.9, "#4d9221"], [1, "#276419"]]}, "xaxis": {"gridcolor": "white", "linecolor": "white", "ticks": "", "title": {"standoff": 15}, "zerolinecolor": "white", "automargin": true, "zerolinewidth": 2}, "yaxis": {"gridcolor": "white", "linecolor": "white", "ticks": "", "title": {"standoff": 15}, "zerolinecolor": "white", "automargin": true, "zerolinewidth": 2}, "scene": {"xaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}, "yaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}, "zaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}}, "shapedefaults": {"line": {"color": "#2a3f5f"}}, "annotationdefaults": {"arrowcolor": "#2a3f5f", "arrowhead": 0, "arrowwidth": 1}, "geo": {"bgcolor": "white", "landcolor": "#E5ECF6", "subunitcolor": "white", "showland": true, "showlakes": true, "lakecolor": "white"}, "title": {"x": 0.05}, "mapbox": {"style": "light"}}}}};
Plotly.plot('cons-footprint-plot', graphs, {}, {responsive: true});

Dev (empty line plots)

HTML

<body>
  <div id="cons-footprint-plot" class="chart"></div>
</body>

JS

var graphs = {"data": [{"dx": 1, "dy": 1, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "total", "text": ["total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total", "total"], "textposition": "top center", "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "wRLLh0ecAEAWb2o56xEAQLQEJX3V2f8/Gmrbkp0hAEBZzv8wIqn+P5bKQmQU7f4/atF0kE8iAEBZdIQ4DAQAQJji1wGwyf8/4wbU0qcYAUCHFSTAWdQAQJwcfFGeowBA5R+nP6YWAkDRuLhY/QkDQE7PnSsQAQNAf1YdSxITAkAre3H3//8BQIC8rgvfkQJACBontqheA0AAeWXNHtUEQM8LyanmnAVA8I6Qv74EBEAEZPGLM6kCQEHudgHEjANAd0fYlqM8BECs0iX9BtYCQG9pCseNBgNASM5LgR4IBEAyj4BtaaUEQN77nbvBvgRA5zGGUnceBUBomy6kI9QEQNLh3AzfGwVANxrPvFevBkAMe8L38iAFQMhCZ6hhgAhAyhszmFdOCECe/eUzzj0IQBS7MPBerxBAbZUT7CO7CEDZ/uyvHIwMQDYdaO58hQlAVtCzk/22BkCyfiQJ2hsGQDqcyND1OQhACJHNooACCUArRRsM27EJQMIPTuc2FgpAEZga554BCEAwn3xVDZ4KQO0suFa0bQdAxaxBXSV+CECqoEIPoYgGQGwUZ7gFaAVAz3q2rVGHBUBS9SOy4FoFQFGyuE6NbAVAfpYg3juUBECYQn0ONioEQMlrwF/FhgFA9wfzFpK1AkDlEQp2JkgCQA=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "builtup land", "text": ["builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand", "builtupLand"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "E5IJ4oWeoD/7e8XYjFuiPzNn3b72TKM/iIJZW+kMpj+LfffsQZmoP67uDCz406k/paJGxyaoqT9HaWCVelyqP/DO4LC6rao/JhFt6CuDrT8chP5Hx4KtPw53W8bI7aw/Bam+LLr6rD9L/AHM6LasPxo473SC1K0/f1krF05tqz9y1vSLf0OrPxJbWvlzba8/0C/FR3bFrT98PheZXzmwP76+P6RAQLA/ORBcsj3yrz/pRnn0hxewP9jtubNG0LA/As8NyEFwsT8ivuEklcGyP/MtC1wEdrI/qJsNheHfsD/RixkMEW6wP3itWQIQIrA/PfKyzGSBrT9dPgHqoYeuP+ACzh3r2q4/2XK9gEl5rj9LsIXPGhevP0Y3tz5+GbA/8buSimPhrz8q2l9YbsawP7j3mCOmWbA/FAFpfVpurz+HTA0yKN2wP3mDeN5Cl68//C076fVfsD/C0pu3vOywPz2WqmRahLA/qLyY/sjEsD9TcclhxrKwP66F2YE58bA/eo/dtm4VsD+hFQ3mJcawP0yby8HKzK4/kxkq7+6SsD+REzLCXiayP4LxE8RgHrI/2px9q5jqsT8Eq7Vx6R+zPy2nAAPBtbQ/DSfLVBXRtD8AXx5DUJm1P0gqlPfw9bQ/cBU1WggPtT9aJBmiuiK1Pw=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "crop land", "text": ["cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand", "cropLand"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "z3yKCiPw3D+opmNhY/7bP3aWjIcW39s/rPZMjP7H3D+9FuVz31TZP21dPWzBytk/jRIr1DZJ2T/zQw7cvtraP9AE4hyNLdo/lcQ2o8Ri3D9RumHMH0XZP4+AQBKLj9g/UxmjM1L/2j/pdZBis6neP/nIXiuXZd0/L7FnFMNO2T+L9hfot7XaP2jxMk/3Kt0/iDt3nSsr3T9OtI76N6jhPzOWpBpGwOE/YgFPYpvV4D9X968Xss7hP/BLQTPdWuE/cDabivDG4D9YcgMtDYneP2H/CHxD/d8/SrsggAum4D8LkljBPGnhP5hHcVuHvuM/n2PTOid64z9/ug6p3VDkPwxuzIr4DuQ/mQO/XO1V4z8zbzu1RUXhP8SXwO/U3eM/M4W4QhCP4z/KVFSYlKDkP3SzcOLmZOU/NG3K337d5T8/OyW1pnvmP7nzqYMSJec/ZN1DKPnT5j+HNhKkqiHmP/C7ESwhDOY/EN83nC6c5j/nb4jC5MrlP1NcIJ3sruQ/R24EKpLw4z8cwegVC9TjPwNtLCyAS+M/jSPoqLOm4z93cZ9j4/3hP1/gpO5bgeI//zysZMTp4T8YTqeZ8IfiP8U7Y/iMR+I/WVmejSRH4j/ZZnvV7vDhPwrdJ1ny9N8/aIhiQkzH3z9MXEV7UZTfPw=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "forest land", "text": ["forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand", "forestLand"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "MnBm7D2i0z/c8Jcd1vTTP5QCgXdM7tM/fhM0BSrm0z/IbjE6ItLTP8iZS5QzPtM/tAsXURqc0z8wzWqcVknTPwG/FMclQtM/1YAEwQ760z8HlJBnb3XSPwql8GzzLtI/NmNftq0l0j//UL1U1vTSP4wfrOn7odI/4A2gpaKU0j+sx8rpk6XSP4a2gR7C1M8/F8u7dd9d0D9l/BzLDE7RP+FHuwuC4tA/zlnwqc260D+4CmrNUF7QP9tfwcdyMdA/jbZc/QR60D8mNBQh0zTQP7GUy8CnWtA/FLVhs51E0D8zDIBel0jQP6ncbcmo7M8/WZwWa/jKzz/ZPgOJIAvQPzXz4bgwqNA/5uLUU8lf0D8UQK4n/TrQP9h+hzRdic4/yW5NCELIzz/5QNL1tbvQPyHpD9K48tE/9uLL1pQZ0z+DDVApFU7RP9uUOSETFtE/858V9jLY0T96nH7JhfTSP4uO8w/O99I/B+WALqSm1D/VC5bu0h/VP5ieiOSf0dM/Htk29TFY0D/Ycv/24wbRP5PVlvMFr9A/OJCs6Lqs0D9Ca50EftfQP/0FOXsYotA/b9boFBWp0D8y8PgACQ/RP7YkK218/dE/ysD1cejP0T9ecM1XI+vQP8of9PVfJNE/iTPYYOML0T8qKu/BivDQPw=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "fishing ground", "text": ["fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround", "fishingGround"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "8Ec1raxTsT+IjYN43rSyP72zkIILELQ/3xxbIANJrz8sLbNuh42sPyFOV0Jpra4/zOd1pKA4sD925hbesHKsP1dsA6aL+Ks/urLiPuberT8LlLEHk/CwP8FGrCFRIbE/uKwXNegIsz8fiwZTP9mwP68kbiIFr7A/W/hBAPeWqT9wSiwwcn2nP2C7r7kuIrA/ONy7g8dTsj/bFTceta2zP+LnBf5Ek7o/pXGTo3HMsz8ETfWuJSmxP8paIkVYdLc/phq3POBFtT+l8cPRbYi0P2R2gwQ8jbU/Jq/Aj4l9uD8wi3yGaSu6Px+4+qy7Z7w/er16JI2Guj8D9Okd1Qa6P5Pkfxfvtro/03CZm7oHvD+f7Ksa2k68PxxtJwmz5b0/Io2XAl1lvz8DIen67hq5PyMr+QLkR7o/hSlnbrEBuD+9prVy6xe3P5GHfKfuArk/9MyHefQguD/w5hoWxpi5P56/lI8xqro/GIzt/64UuD9I+jEthQu5P6XPTWsrCrc/YqkJgEHQtD8acCuifhm2P48osJl7RrM/ualEcFGVsj/Kp9eTfdC1P53ESqhPrbk/UnO7gWO2vT/L6baMgKi+P8qvmGkIeb4/TFIheyMWvT+hwWJzSWC7P9alNSXbMLo/kMm1lHELuj9f1A6PqeG5Pw=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "grazing land", "text": ["grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand", "grazingLand"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "pKbv4sYB5z8nZOiOvDvmP7xbDcxn5eU/2h2/i/sn5j+woW4dwEvlP4ZOr5i7ROQ/I96+17Tt4z/ycS3TgNHiP1y13GWm1+E/lRp9Xv8z4T/v9i/9D+HgP4L2wBv7998/eBvBq3vX3z/VLpXVZQ7gP8C9VQIC1t8/yYOsSF5G3j8YI88U2/PcPxfsjblpSds/PyyEnZLw2z9N9/UhTl3cP5sO/tL46ts/v2nDc0jA2j+2jV+9kGnaPzagM57yUNo/GjEtfXA+2j9zZNoSCIHYPx7jhd50INg/A+nEj31j2T8dO7AoQkPZPzBo+o/oKtg/1ajdW24Z2T/o7oVdoVjZP1L3O5Jg09c/IoGFyaoA2D/pwcqECMHUP+WG2snkgtY/YWXE9lDG1z9Kcn0hLXDYP8bVYywdLdg/jpGTEMBG2D907jpJ/RbYPz9mJgxYntg/1ICcn4Jf1j9tncvwZSXVPwGnxX4PK9U/vG6DfdLh1D/S5hBJqiPVPyzojlNiddQ/fPPP9fsR0z8xgIG0hrnRP02lCdwbH9A/GYfOZ+ZSzj95Xe7SPFfPPyi1+fImKc4/s+IPdLKvzT81uewNVcPNP+uP3IJNT80/mZTRaDuGzD/esx14EOfLPwcIZmBsBso/YY3XbD/hyT8nPi8Yu7fJPw=="}, "type": "scatter"}, {"connectgaps": true, "hoverinfo": "x+y+text", "marker": {"line": {"width": 0}, "showscale": false, "size": 2}, "mode": "lines+markers", "name": "carbon", "text": ["carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon", "carbon"], "x": {"dtype": "i2", "bdata": "qQeqB6sHrAetB64HrwewB7EHsgezB7QHtQe2B7cHuAe5B7oHuwe8B70Hvge/B8AHwQfCB8MHxAfFB8YHxwfIB8kHygfLB8wHzQfOB88H0AfRB9IH0wfUB9UH1gfXB9gH2QfaB9sH3AfdB94H3wfgB+EH4gfjB+QH5QfmBw=="}, "y": {"dtype": "f8", "bdata": "qNf5mZHj3z8jhk31/SvdP9Po66SBYdw/+HZlXg9k3T89G5avLUHcPzYOVzG5Ed8/ODFwVkqH4j/VYXCbsr/iPzhqacZ7meM/6mFAGBVK5z8sHfGT0JzoPzQk3Mc1QOk/UdNLipKr7T/T34U6tGPvP/wYlasmEfA/bGOk2SLn7z8B6qpOXazvP2A89wV/DvE/HICm1YFL8j+X9cmW2SzzP2UcbTQTefQ/vZTAPpGD8j8X+kKeFUrvP+4xQiA2R/E/HCt0aU/88j+ax6Sys2fxP6lKNYHPbvE/tLJwwFm98j8EYl9vponzP9e3YdFTzfI/uTCbaqyr8z/65ASZPZLyP7SjJTcXb/M/EpcozlXn9j/OEaIxm6L1P6i9aOsAwPo/8B7Royn1+T9CVJmAQ0L5P2hAwhZ9bAVAklyYQ+Uz+T/eOCwX6IAAQDm1N85sfvo/HvqshwJu9T8M6NGkC3j0P8gXlug6svg/FLmVzDTH+T/b3hiwf1H7P1maM6OAQ/0/NdICOw7i+j9kjFAWABoAQEylyBNS1/o/r2bzWOEA/T9sxs+LG3L5PzBViHX35PY/CxSH0nU/9z8vp5GVFVn2Py7Wz74eWfY/+ZXbXrDh9D8wrd0xsJT0P2R64N37k/A/aMGNuIgI8z/Cmq422EfyPw=="}, "type": "scatter"}], "layout": {"annotations": [{"showarrow": false, "text": "Ecological Footprint of consumption in global hectares (gha) divided by population", "x": 0.0, "xref": "paper", "y": -0.1, "yref": "paper"}], "font": {"family": "Arial"}, "hovermode": "closest", "legend": {"title": {"font": {"family": "Arial"}}, "orientation": "h", "xanchor": "center", "yanchor": "top", "x": 0.5, "y": 1.0}, "margin": {"b": 40, "l": 20, "r": 20, "t": 35}, "showlegend": true, "title": {"font": {"family": "Arial", "size": 16}, "text": "Mexico: Ecological Footprint per person", "x": 0.5}, "yaxis": {"tickformat": ".2f"}, "template": {"data": {"histogram2dcontour": [{"type": "histogram2dcontour", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "choropleth": [{"type": "choropleth", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "histogram2d": [{"type": "histogram2d", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "heatmap": [{"type": "heatmap", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "contourcarpet": [{"type": "contourcarpet", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "contour": [{"type": "contour", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "surface": [{"type": "surface", "colorbar": {"outlinewidth": 0, "ticks": ""}, "colorscale": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]]}], "mesh3d": [{"type": "mesh3d", "colorbar": {"outlinewidth": 0, "ticks": ""}}], "scatter": [{"fillpattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}, "type": "scatter"}], "parcoords": [{"type": "parcoords", "line": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterpolargl": [{"type": "scatterpolargl", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "bar": [{"error_x": {"color": "#2a3f5f"}, "error_y": {"color": "#2a3f5f"}, "marker": {"line": {"color": "#E5ECF6", "width": 0.5}, "pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "bar"}], "scattergeo": [{"type": "scattergeo", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterpolar": [{"type": "scatterpolar", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "histogram": [{"marker": {"pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "histogram"}], "scattergl": [{"type": "scattergl", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatter3d": [{"type": "scatter3d", "line": {"colorbar": {"outlinewidth": 0, "ticks": ""}}, "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scattermap": [{"type": "scattermap", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scattermapbox": [{"type": "scattermapbox", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scatterternary": [{"type": "scatterternary", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "scattercarpet": [{"type": "scattercarpet", "marker": {"colorbar": {"outlinewidth": 0, "ticks": ""}}}], "carpet": [{"aaxis": {"endlinecolor": "#2a3f5f", "gridcolor": "white", "linecolor": "white", "minorgridcolor": "white", "startlinecolor": "#2a3f5f"}, "baxis": {"endlinecolor": "#2a3f5f", "gridcolor": "white", "linecolor": "white", "minorgridcolor": "white", "startlinecolor": "#2a3f5f"}, "type": "carpet"}], "table": [{"cells": {"fill": {"color": "#EBF0F8"}, "line": {"color": "white"}}, "header": {"fill": {"color": "#C8D4E3"}, "line": {"color": "white"}}, "type": "table"}], "barpolar": [{"marker": {"line": {"color": "#E5ECF6", "width": 0.5}, "pattern": {"fillmode": "overlay", "size": 10, "solidity": 0.2}}, "type": "barpolar"}], "pie": [{"automargin": true, "type": "pie"}]}, "layout": {"autotypenumbers": "strict", "colorway": ["#636efa", "#EF553B", "#00cc96", "#ab63fa", "#FFA15A", "#19d3f3", "#FF6692", "#B6E880", "#FF97FF", "#FECB52"], "font": {"color": "#2a3f5f"}, "hovermode": "closest", "hoverlabel": {"align": "left"}, "paper_bgcolor": "white", "plot_bgcolor": "#E5ECF6", "polar": {"bgcolor": "#E5ECF6", "angularaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "radialaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}}, "ternary": {"bgcolor": "#E5ECF6", "aaxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "baxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}, "caxis": {"gridcolor": "white", "linecolor": "white", "ticks": ""}}, "coloraxis": {"colorbar": {"outlinewidth": 0, "ticks": ""}}, "colorscale": {"sequential": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]], "sequentialminus": [[0.0, "#0d0887"], [0.1111111111111111, "#46039f"], [0.2222222222222222, "#7201a8"], [0.3333333333333333, "#9c179e"], [0.4444444444444444, "#bd3786"], [0.5555555555555556, "#d8576b"], [0.6666666666666666, "#ed7953"], [0.7777777777777778, "#fb9f3a"], [0.8888888888888888, "#fdca26"], [1.0, "#f0f921"]], "diverging": [[0, "#8e0152"], [0.1, "#c51b7d"], [0.2, "#de77ae"], [0.3, "#f1b6da"], [0.4, "#fde0ef"], [0.5, "#f7f7f7"], [0.6, "#e6f5d0"], [0.7, "#b8e186"], [0.8, "#7fbc41"], [0.9, "#4d9221"], [1, "#276419"]]}, "xaxis": {"gridcolor": "white", "linecolor": "white", "ticks": "", "title": {"standoff": 15}, "zerolinecolor": "white", "automargin": true, "zerolinewidth": 2}, "yaxis": {"gridcolor": "white", "linecolor": "white", "ticks": "", "title": {"standoff": 15}, "zerolinecolor": "white", "automargin": true, "zerolinewidth": 2}, "scene": {"xaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}, "yaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}, "zaxis": {"backgroundcolor": "#E5ECF6", "gridcolor": "white", "linecolor": "white", "showbackground": true, "ticks": "", "zerolinecolor": "white", "gridwidth": 2}}, "shapedefaults": {"line": {"color": "#2a3f5f"}}, "annotationdefaults": {"arrowcolor": "#2a3f5f", "arrowhead": 0, "arrowwidth": 1}, "geo": {"bgcolor": "white", "landcolor": "#E5ECF6", "subunitcolor": "white", "showland": true, "showlakes": true, "lakecolor": "white"}, "title": {"x": 0.05}, "mapbox": {"style": "light"}}}}};
Plotly.plot('cons-footprint-plot', graphs, {}, {responsive: true});

[gvwilson]

@marthacryan please have a look and see if this is a regression.

[marthacryan]

@ParfaitG Thanks for filing this issue! I'm having trouble reproducing what you're describing. A couple pieces that would help me debug:

• Do you mind including a flask app that reproduces this error? The python code included above just shows how you're encoding the figure but I'm curious how you're displaying it on the page.
• How are you including plotly.js? I'm curious which version you're using in the jsfiddle, because I'm not able to reproduce an issue in jsfiddle. Here's a codepen where I tried to reproduce it: https://codepen.io/marthacryan/pen/OPJNbQe

[ParfaitG]

Hmmm ... the issue looks to be the JS version. I have been using https://cdn.plot.ly/plotly-latest.min.js which reproduces my issue in your codepen. Also, Plotly.plot() raises error with this new version, but I must now use as you do Plotly.newPlot(). Making these two changes in my HTML template resolves my issue.

And reading closer in the 3.0.0 changelog which I only have been reading the Python 6.0.0 changelog, I see the note:

Drop Plotly.plot from the API

Maybe these breaking changes to API should be emphasized better? I had quite a bit of lines using Plotly.plot! But thanks for your help.