Mpld3 generated html missing characters and color in legend
I am just using the matplotlib example here and writing it as html using mpld3.
However, the generated html using mpld3 does not skip xticlabels and color in the legend. If I create a plot without conversion to html, it generates just fine with xticklabels and contains the color in the legend. Its html generated via mpld3 which is missing these elements.
The drawing that is generated directly with pyplot looks like this:
And the html generated via mpld3 looks like this:
<style>
</style>
<div id="fig_el6472544878215208536180784"></div>
<script>
function mpld3_load_lib(url, callback){
var s = document.createElement('script');
s.src = url;
s.async = true;
s.onreadystatechange = s.onload = callback;
s.onerror = function(){console.warn("failed to load library " + url);};
document.getElementsByTagName("head")[0].appendChild(s);
}
if(typeof(mpld3) !== "undefined" && mpld3._mpld3IsLoaded){
// already loaded: just create the figure
!function(mpld3){
mpld3.draw_figure("fig_el6472544878215208536180784", {"axes": [{"xlim": [0.0, 5.0], "yscale": "linear", "axesbg": "#FFFFFF", "texts": [{"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.175, 21.0], "rotation": -0.0, "id": "el647254488090960"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.175, 36.75], "rotation": -0.0, "id": "el647254488091792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "30", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.175, 31.5], "rotation": -0.0, "id": "el647254488092880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.175, 36.75], "rotation": -0.0, "id": "el647254488098128"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "27", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.175, 28.35], "rotation": -0.0, "id": "el647254488078096"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.5249999999999999, 26.25], "rotation": -0.0, "id": "el647254488071312"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "32", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.5250000000000001, 33.6], "rotation": -0.0, "id": "el647254488100112"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "34", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.525, 35.7], "rotation": -0.0, "id": "el647254488101200"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.525, 21.0], "rotation": -0.0, "id": "el647254571107792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.5249999999999995, 26.25], "rotation": -0.0, "id": "el647254571108880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [-0.066910282258064516, 0.5], "rotation": -90.0, "id": "el647254487888336"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores by group and gender", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.5, 1.0144675925925926], "rotation": -0.0, "id": "el647254487951120"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Men", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.93124999999999991], "rotation": -0.0, "id": "el647254488079824"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Women", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.87135416666666654], "rotation": -0.0, "id": "el647254488080528"}], "zoomable": true, "images": [], "xdomain": [0.0, 5.0], "ylim": [0.0, 100.0], "paths": [{"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data01", "id": "el647254487990480"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data02", "id": "el647254488008592"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data03", "id": "el647254488010256"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data02", "id": "el647254488011536"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data04", "id": "el647254488017744"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data05", "id": "el647254488019408"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data06", "id": "el647254488037584"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data07", "id": "el647254488039248"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data01", "id": "el647254488049168"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data05", "id": "el647254488050832"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488080272"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 2, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488089680"}, {"edgecolor": "#000000", "facecolor": "#FFFFFF", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data09", "id": "el647254488079440"}], "sharey": [], "sharex": [], "axesbgalpha": null, "axes": [{"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "bottom", "nticks": 5, "tickvalues": [0.34999999999999998, 1.3500000000000001, 2.3500000000000001, 3.3500000000000001, 4.3499999999999996]}, {"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "left", "nticks": 6, "tickvalues": null}], "lines": [], "markers": [], "id": "el647254487821392", "ydomain": [0.0, 100.0], "collections": [], "xscale": "linear", "bbox": [0.125, 0.099999999999999978, 0.77500000000000002, 0.80000000000000004]}], "height": 480.0, "width": 640.0, "plugins": [{"type": "reset"}, {"enabled": false, "button": true, "type": "zoom"}, {"enabled": false, "button": true, "type": "boxzoom"}], "data": {"data08": [[0.7625126008064516, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9604166666666666, 0.9005208333333332], [0.7625126008064516, 0.9604166666666666, 0.9005208333333332]], "data09": [[0.7496093749999999, 0.8468749999999999], [0.9838709677419354, 0.8468749999999999], [0.9838709677419354, 0.9791666666666665], [0.7496093749999999, 0.9791666666666665], [0.7496093749999999, 0.8468749999999999]], "data06": [[1.35, 0.0], [1.7000000000000002, 0.0], [1.7000000000000002, 32.0], [1.35, 32.0]], "data07": [[2.35, 0.0], [2.7, 0.0], [2.7, 34.0], [2.35, 34.0]], "data04": [[4.0, 0.0], [4.35, 0.0], [4.35, 27.0], [4.0, 27.0]], "data05": [[0.35, 0.0, 4.35], [0.7, 0.0, 4.699999999999999], [0.7, 25.0, 4.699999999999999], [0.35, 25.0, 4.35]], "data02": [[1.0, 0.0, 3.0], [1.35, 0.0, 3.35], [1.35, 35.0, 3.35], [1.0, 35.0, 3.0]], "data03": [[2.0, 0.0], [2.35, 0.0], [2.35, 30.0], [2.0, 30.0]], "data01": [[0.0, 0.0, 3.35], [0.35, 0.0, 3.7], [0.35, 20.0, 3.7], [0.0, 20.0, 3.35]]}, "id": "el647254487821520"});
}(mpld3);
}else if(typeof define === "function" && define.amd){
// require.js is available: use it to load d3/mpld3
require.config({paths: {d3: "https://mpld3.github.io/js/d3.v3.min"}});
require(["d3"], function(d3){
window.d3 = d3;
mpld3_load_lib("https://mpld3.github.io/js/mpld3.v0.2.js", function(){
mpld3.draw_figure("fig_el6472544878215208536180784", {"axes": [{"xlim": [0.0, 5.0], "yscale": "linear", "axesbg": "#FFFFFF", "texts": [{"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.175, 21.0], "rotation": -0.0, "id": "el647254488090960"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.175, 36.75], "rotation": -0.0, "id": "el647254488091792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "30", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.175, 31.5], "rotation": -0.0, "id": "el647254488092880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.175, 36.75], "rotation": -0.0, "id": "el647254488098128"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "27", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.175, 28.35], "rotation": -0.0, "id": "el647254488078096"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.5249999999999999, 26.25], "rotation": -0.0, "id": "el647254488071312"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "32", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.5250000000000001, 33.6], "rotation": -0.0, "id": "el647254488100112"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "34", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.525, 35.7], "rotation": -0.0, "id": "el647254488101200"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.525, 21.0], "rotation": -0.0, "id": "el647254571107792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.5249999999999995, 26.25], "rotation": -0.0, "id": "el647254571108880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [-0.066910282258064516, 0.5], "rotation": -90.0, "id": "el647254487888336"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores by group and gender", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.5, 1.0144675925925926], "rotation": -0.0, "id": "el647254487951120"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Men", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.93124999999999991], "rotation": -0.0, "id": "el647254488079824"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Women", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.87135416666666654], "rotation": -0.0, "id": "el647254488080528"}], "zoomable": true, "images": [], "xdomain": [0.0, 5.0], "ylim": [0.0, 100.0], "paths": [{"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data01", "id": "el647254487990480"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data02", "id": "el647254488008592"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data03", "id": "el647254488010256"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data02", "id": "el647254488011536"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data04", "id": "el647254488017744"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data05", "id": "el647254488019408"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data06", "id": "el647254488037584"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data07", "id": "el647254488039248"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data01", "id": "el647254488049168"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data05", "id": "el647254488050832"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488080272"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 2, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488089680"}, {"edgecolor": "#000000", "facecolor": "#FFFFFF", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data09", "id": "el647254488079440"}], "sharey": [], "sharex": [], "axesbgalpha": null, "axes": [{"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "bottom", "nticks": 5, "tickvalues": [0.34999999999999998, 1.3500000000000001, 2.3500000000000001, 3.3500000000000001, 4.3499999999999996]}, {"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "left", "nticks": 6, "tickvalues": null}], "lines": [], "markers": [], "id": "el647254487821392", "ydomain": [0.0, 100.0], "collections": [], "xscale": "linear", "bbox": [0.125, 0.099999999999999978, 0.77500000000000002, 0.80000000000000004]}], "height": 480.0, "width": 640.0, "plugins": [{"type": "reset"}, {"enabled": false, "button": true, "type": "zoom"}, {"enabled": false, "button": true, "type": "boxzoom"}], "data": {"data08": [[0.7625126008064516, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9604166666666666, 0.9005208333333332], [0.7625126008064516, 0.9604166666666666, 0.9005208333333332]], "data09": [[0.7496093749999999, 0.8468749999999999], [0.9838709677419354, 0.8468749999999999], [0.9838709677419354, 0.9791666666666665], [0.7496093749999999, 0.9791666666666665], [0.7496093749999999, 0.8468749999999999]], "data06": [[1.35, 0.0], [1.7000000000000002, 0.0], [1.7000000000000002, 32.0], [1.35, 32.0]], "data07": [[2.35, 0.0], [2.7, 0.0], [2.7, 34.0], [2.35, 34.0]], "data04": [[4.0, 0.0], [4.35, 0.0], [4.35, 27.0], [4.0, 27.0]], "data05": [[0.35, 0.0, 4.35], [0.7, 0.0, 4.699999999999999], [0.7, 25.0, 4.699999999999999], [0.35, 25.0, 4.35]], "data02": [[1.0, 0.0, 3.0], [1.35, 0.0, 3.35], [1.35, 35.0, 3.35], [1.0, 35.0, 3.0]], "data03": [[2.0, 0.0], [2.35, 0.0], [2.35, 30.0], [2.0, 30.0]], "data01": [[0.0, 0.0, 3.35], [0.35, 0.0, 3.7], [0.35, 20.0, 3.7], [0.0, 20.0, 3.35]]}, "id": "el647254487821520"});
});
});
}else{
// require.js not available: dynamically load d3 & mpld3
mpld3_load_lib("https://mpld3.github.io/js/d3.v3.min.js", function(){
mpld3_load_lib("https://mpld3.github.io/js/mpld3.v0.2.js", function(){
mpld3.draw_figure("fig_el6472544878215208536180784", {"axes": [{"xlim": [0.0, 5.0], "yscale": "linear", "axesbg": "#FFFFFF", "texts": [{"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.175, 21.0], "rotation": -0.0, "id": "el647254488090960"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.175, 36.75], "rotation": -0.0, "id": "el647254488091792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "30", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.175, 31.5], "rotation": -0.0, "id": "el647254488092880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "35", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.175, 36.75], "rotation": -0.0, "id": "el647254488098128"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "27", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.175, 28.35], "rotation": -0.0, "id": "el647254488078096"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [0.5249999999999999, 26.25], "rotation": -0.0, "id": "el647254488071312"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "32", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [1.5250000000000001, 33.6], "rotation": -0.0, "id": "el647254488100112"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "34", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [2.525, 35.7], "rotation": -0.0, "id": "el647254488101200"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "20", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [3.525, 21.0], "rotation": -0.0, "id": "el647254571107792"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "25", "coordinates": "data", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [4.5249999999999995, 26.25], "rotation": -0.0, "id": "el647254571108880"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 12.0, "position": [-0.066910282258064516, 0.5], "rotation": -90.0, "id": "el647254487888336"}, {"v_baseline": "auto", "h_anchor": "middle", "color": "#000000", "text": "Scores by group and gender", "coordinates": "axes", "zorder": 3, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.5, 1.0144675925925926], "rotation": -0.0, "id": "el647254487951120"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Men", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.93124999999999991], "rotation": -0.0, "id": "el647254488079824"}, {"v_baseline": "auto", "h_anchor": "start", "color": "#000000", "text": "Women", "coordinates": "axes", "zorder": 1000003.0, "alpha": 1, "fontsize": 14.399999999999999, "position": [0.85283518145161274, 0.87135416666666654], "rotation": -0.0, "id": "el647254488080528"}], "zoomable": true, "images": [], "xdomain": [0.0, 5.0], "ylim": [0.0, 100.0], "paths": [{"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data01", "id": "el647254487990480"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data02", "id": "el647254488008592"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data03", "id": "el647254488010256"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data02", "id": "el647254488011536"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data04", "id": "el647254488017744"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data05", "id": "el647254488019408"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data06", "id": "el647254488037584"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 0, "data": "data07", "id": "el647254488039248"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data01", "id": "el647254488049168"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "data", "dasharray": "10,0", "zorder": 1, "alpha": 1, "xindex": 2, "data": "data05", "id": "el647254488050832"}, {"edgecolor": "#000000", "facecolor": "#FF0000", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488080272"}, {"edgecolor": "#000000", "facecolor": "#BFBF00", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "Z"], "yindex": 2, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data08", "id": "el647254488089680"}, {"edgecolor": "#000000", "facecolor": "#FFFFFF", "edgewidth": 1.0, "pathcodes": ["M", "L", "L", "L", "L", "Z"], "yindex": 1, "coordinates": "axes", "dasharray": "10,0", "zorder": 1000001.0, "alpha": 1, "xindex": 0, "data": "data09", "id": "el647254488079440"}], "sharey": [], "sharex": [], "axesbgalpha": null, "axes": [{"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "bottom", "nticks": 5, "tickvalues": [0.34999999999999998, 1.3500000000000001, 2.3500000000000001, 3.3500000000000001, 4.3499999999999996]}, {"scale": "linear", "tickformat": null, "grid": {"gridOn": false}, "fontsize": 12.0, "position": "left", "nticks": 6, "tickvalues": null}], "lines": [], "markers": [], "id": "el647254487821392", "ydomain": [0.0, 100.0], "collections": [], "xscale": "linear", "bbox": [0.125, 0.099999999999999978, 0.77500000000000002, 0.80000000000000004]}], "height": 480.0, "width": 640.0, "plugins": [{"type": "reset"}, {"enabled": false, "button": true, "type": "zoom"}, {"enabled": false, "button": true, "type": "boxzoom"}], "data": {"data08": [[0.7625126008064516, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9312499999999999, 0.8713541666666665], [0.8270287298387096, 0.9604166666666666, 0.9005208333333332], [0.7625126008064516, 0.9604166666666666, 0.9005208333333332]], "data09": [[0.7496093749999999, 0.8468749999999999], [0.9838709677419354, 0.8468749999999999], [0.9838709677419354, 0.9791666666666665], [0.7496093749999999, 0.9791666666666665], [0.7496093749999999, 0.8468749999999999]], "data06": [[1.35, 0.0], [1.7000000000000002, 0.0], [1.7000000000000002, 32.0], [1.35, 32.0]], "data07": [[2.35, 0.0], [2.7, 0.0], [2.7, 34.0], [2.35, 34.0]], "data04": [[4.0, 0.0], [4.35, 0.0], [4.35, 27.0], [4.0, 27.0]], "data05": [[0.35, 0.0, 4.35], [0.7, 0.0, 4.699999999999999], [0.7, 25.0, 4.699999999999999], [0.35, 25.0, 4.35]], "data02": [[1.0, 0.0, 3.0], [1.35, 0.0, 3.35], [1.35, 35.0, 3.35], [1.0, 35.0, 3.0]], "data03": [[2.0, 0.0], [2.35, 0.0], [2.35, 30.0], [2.0, 30.0]], "data01": [[0.0, 0.0, 3.35], [0.35, 0.0, 3.7], [0.35, 20.0, 3.7], [0.0, 20.0, 3.35]]}, "id": "el647254487821520"});
})
});
}
</script>
Any ideas how I can fix this? Is this a mpld3 bug?
And here is the python code I am using:
#!/usr/bin/env python
# a bar plot with errorbars
import numpy as np
import matplotlib.pyplot as plt
import mpld3
N = 5
menMeans = (20, 35, 30, 35, 27)
menStd = (2, 3, 4, 1, 2)
ind = np.arange(N) # the x locations for the groups
width = 0.35 # the width of the bars
fig, ax = plt.subplots()
ax.set_ylim(0, 100)
rects1 = ax.bar(ind, menMeans, width, color='r', label='Men')
womenMeans = (25, 32, 34, 20, 25)
womenStd = (3, 5, 2, 3, 3)
rects2 = ax.bar(ind+width, womenMeans, width, color='y', label='Women')
# add some text for labels, title and axes ticks
ax.set_ylabel('Scores')
ax.set_title('Scores by group and gender')
ax.set_xticks(ind+width)
ax.set_xticklabels( ('G1', 'G2', 'G3', 'G4', 'G5') )
ax.legend(loc=0)
def autolabel(rects):
# attach some text labels
for rect in rects:
height = rect.get_height()
ax.text(rect.get_x()+rect.get_width()/2., 1.05*height, '%d'%int(height),
ha='center', va='bottom')
autolabel(rects1)
autolabel(rects2)
mpld3.save_html(fig,'./outbar.html')
+3
source to share
1 answer
Not all matplotlib functions are fully supported in mpld3. Here is the list: mpld3 is missing features .
set_xticklabels()
does not affect mpld3 charts. See question 22 .
UPD: Tested with version 0.2 and 0.3git.
0
source to share