Bokeh Components功能，通过API嵌入

时间：2018-04-13 06:19:39

标签： javascript python pandas bokeh

是否可以构建一个可以调用散景组件的API。是否可以在前端提供服务和标签？

例如，以下代码是组件功能的输出：

<html lang="en">
   <head>
       <meta charset="utf-8">
       <title>Bokeh Scatter Plots</title>

       <link rel="stylesheet" href="http://cdn.pydata.org/bokeh/release/bokeh-0.12.6.min.css" type="text/css" />
       <script type="text/javascript" src="http://cdn.pydata.org/bokeh/release/bokeh-0.12.6.min.js"></script>

       <script type="text/javascript">
  (function() {
    var fn = function() {
      Bokeh.safely(function() {
        (function(root) {
          function embed_document(root) {

          var docs_json = '{"4679a6cd-12e0-4168-983e-135a2e29f86d":{"roots":{"references":[{"attributes":{"callback":null,"factors":["LP","KC","BDR","JHU","LKW","COL","GTK","POW","INM","PH","HO"]},"id":"f6f7ea91-f359-4edd-a3d0-4a78c8a5f049","type":"FactorRange"},{"attributes":{},"id":"b5b8c165-97b7-4186-968c-bb716863fcf0","type":"WheelZoomTool"},{"attributes":{"callback":null},"id":"ac5ff865-bb97-49c1-b48b-458af97677c3","type":"DataRange1d"},{"attributes":{},"id":"43903bfe-e57a-4209-acff-69fb3ac987d7","type":"CategoricalTicker"},{"attributes":{"source":{"id":"f09064ff-2fbd-40ef-8655-7d15cc2c9078","type":"ColumnDataSource"}},"id":"be481d41-174d-44e9-aff0-bc542466e8b0","type":"CDSView"},{"attributes":{},"id":"04a5ee34-c4b3-4091-b330-1b046c590def","type":"SaveTool"},{"attributes":{},"id":"5521c46a-8d7e-4da4-bcd9-f4d2fce8fda4","type":"LinearScale"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"plot":null,"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"8f60b37d-d8d0-4e4c-a697-7f82d69eb638","type":"BoxAnnotation"},{"attributes":{"grid_line_color":{"value":null},"plot":{"id":"b8da88d1-af1a-412d-bf22-d9b50a23a43e","subtype":"Figure","type":"Plot"},"ticker":{"id":"964bb707-8b12-46bc-bcad-92ab516a7a51","type":"BasicTicker"}},"id":"aeca19b9-3d69-4dfb-ba8a-9e4e25e6a9e6","type":"Grid"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_scroll":"auto","active_tap":"auto","tools":[{"id":"3f8cfcd2-de17-4926-8cb1-5b0372efe0ca","type":"PanTool"},{"id":"7294de09-c621-411a-9e35-31f20b48165e","type":"WheelZoomTool"},{"id":"d2f923f0-030f-4e05-8f87-58e0e957f447","type":"BoxZoomTool"},{"id":"cabfb040-4b40-46c1-81d6-4d3bd56e7620","type":"SaveTool"},{"id":"b31cafab-420a-43e4-a0ea-7d7ba424f5ba","type":"ResetTool"},{"id":"84d31a0a-0596-47ea-ad1b-1ec36b760e90","type":"HelpTool"},{"id":"76f7b209-8983-43d8-a7f6-96d217013711","type":"HoverTool"}]},"id":"378f020f-33ce-4ae4-85fe-3e6bfc59a609","type":"Toolbar"},{"attributes":{},"id":"08fa23f5-ccdb-4811-aae3-7e7a3557999a","type":"CategoricalScale"},{"attributes":{"plot":null,"text":""},"id":"cd1f4158-7918-4b54-8b4a-f1e152333437","type":"Title"},{"attributes":{},"id":"33e65275-4a69-48db-93f9-040cf94d504c","type":"ResetTool"},{"attributes":{},"id":"8441b708-7b9f-4a31-9487-d38bdc4c7300","type":"LinearScale"},{"attributes":{"fill_color":{"value":"#6C69EB"},"height":{"value":0.5},"right":{"field":"Sales"},"y":{"field":"ID"}},"id":"ca5758ae-4572-48f3-be74-9e84322afbf2","type":"HBar"},{"attributes":{},"id":"b8eed6e8-eec8-497e-a2de-62e2e503bec9","type":"PanTool"},{"attributes":{"plot":null,"text":""},"id":"841b8725-8df8-4673-8c4b-a08546f48c6d","type":"Title"},{"attributes":{"data_source":{"id":"beb6b439-f3a7-4a41-b107-7b7d36a4fc1e","type":"ColumnDataSource"},"glyph":{"id":"ca5758ae-4572-48f3-be74-9e84322afbf2","type":"HBar"},"hover_glyph":null,"muted_glyph":null,"view":{"id":"aa29be63-62fc-4116-b133-d905dee2bbdd","type":"CDSView"}},"id":"79f0f062-e8ae-44b8-b714-e3181a8763c1","type":"GlyphRenderer"},{"attributes":{"callback":null,"column_names":["Count","Sales","ID"],"data":{"Count":[177834,119206,107828,95426,75541,67647,61662,60852,32650,11511,3871],"ID":["LP","KC","BDR","JHU","LKW","COL","GTK","POW","INM","PH","HO"],"Sales":[314305933,185329243,188463555,150196418,134483188,102851629,127717657,126289415,51907783,24004317,32662]}},"id":"f09064ff-2fbd-40ef-8655-7d15cc2c9078","type":"ColumnDataSource"},{"attributes":{"bottom_units":"screen","fill_alpha":{"value":0.5},"fill_color":{"value":"lightgrey"},"left_units":"screen","level":"overlay","line_alpha":{"value":1.0},"line_color":{"value":"black"},"line_dash":[4,4],"line_width":{"value":2},"plot":null,"render_mode":"css","right_units":"screen","top_units":"screen"},"id":"c1f39d73-fcf3-4288-bad1-3d5d51851031","type":"BoxAnnotation"},{"attributes":{},"id":"b48ce5f5-e469-4147-9531-dc87bf04e2a0","type":"CategoricalTickFormatter"},{"attributes":{"callback":null},"id":"6f1d229f-3088-44be-a746-cbfcc8fb8be1","type":"DataRange1d"},{"attributes":{"data_source":{"id":"f09064ff-2fbd-40ef-8655-7d15cc2c9078","type":"ColumnDataSource"},"glyph":{"id":"e8d00a34-5945-48fa-9225-a6562477ad92","type":"HBar"},"hover_glyph":null,"muted_glyph":null,"view":{"id":"be481d41-174d-44e9-aff0-bc542466e8b0","type":"CDSView"}},"id":"5e652ad2-126a-4eb2-ac84-902563c29a80","type":"GlyphRenderer"},{"attributes":{},"id":"7294de09-c621-411a-9e35-31f20b48165e","type":"WheelZoomTool"},{"attributes":{"axis_label":"Merchant","axis_line_color":{"value":null},"formatter":{"id":"76cb3daf-61d3-4a12-a4a6-40f63758108e","type":"CategoricalTickFormatter"},"plot":{"id":"b8da88d1-af1a-412d-bf22-d9b50a23a43e","subtype":"Figure","type":"Plot"},"ticker":{"id":"8d2f49f8-19a4-4f2f-bd8e-d38ab5e07201","type":"CategoricalTicker"}},"id":"83a8c787-ec68-4496-ae53-67b03ba0e31a","type":"CategoricalAxis"},{"attributes":{"callback":null,"column_names":["Count","Sales","ID"],"data":{"Count":[177834,119206,107828,95426,75541,67647,61662,60852,32650,11511,3871],"ID":["LP","KC","BDR","JHU","LKW","COL","GTK","POW","INM","PH","HO"],"Sales":[314305933,185329243,188463555,150196418,134483188,102851629,127717657,126289415,51907783,24004317,32662]}},"id":"beb6b439-f3a7-4a41-b107-7b7d36a4fc1e","type":"ColumnDataSource"},{"attributes":{},"id":"833dad25-6dc6-4e36-a9fa-578c58c2885d","type":"HelpTool"},{"attributes":{"axis_label":"Sales","axis_line_color":{"value":null},"formatter":{"id":"08327f98-3e2c-4dc5-a337-6b45bb0026ba","type":"BasicTickFormatter"},"major_label_text_font_size":{"value":"0pt"},"major_tick_line_color":{"value":null},"minor_tick_line_color":{"value":null},"plot":{"id":"b8da88d1-af1a-412d-bf22-d9b50a23a43e","subtype":"Figure","type":"Plot"},"ticker":{"id":"964bb707-8b12-46bc-bcad-92ab516a7a51","type":"BasicTicker"}},"id":"fbf71a90-71e2-4ee5-b53e-de0e5ff827fc","type":"LinearAxis"},{"attributes":{},"id":"76cb3daf-61d3-4a12-a4a6-40f63758108e","type":"CategoricalTickFormatter"},{"attributes":{"below":[{"id":"9ba9f5f6-0a75-40cc-93ad-37ce28f66249","type":"LinearAxis"}],"left":[{"id":"173a3635-c5d0-4c00-9f28-0fceac107750","type":"CategoricalAxis"}],"outline_line_alpha":{"value":0.2},"renderers":[{"id":"9ba9f5f6-0a75-40cc-93ad-37ce28f66249","type":"LinearAxis"},{"id":"3c705b55-1ccb-443a-8f0d-d64826834943","type":"Grid"},{"id":"173a3635-c5d0-4c00-9f28-0fceac107750","type":"CategoricalAxis"},{"id":"c7f4a660-eeb6-4eb5-b196-8dbf00dadca4","type":"Grid"},{"id":"8f60b37d-d8d0-4e4c-a697-7f82d69eb638","type":"BoxAnnotation"},{"id":"79f0f062-e8ae-44b8-b714-e3181a8763c1","type":"GlyphRenderer"}],"title":{"id":"841b8725-8df8-4673-8c4b-a08546f48c6d","type":"Title"},"toolbar":{"id":"378f020f-33ce-4ae4-85fe-3e6bfc59a609","type":"Toolbar"},"x_range":{"id":"6f1d229f-3088-44be-a746-cbfcc8fb8be1","type":"DataRange1d"},"x_scale":{"id":"5521c46a-8d7e-4da4-bcd9-f4d2fce8fda4","type":"LinearScale"},"y_range":{"id":"eab96392-b6f3-485d-a66a-347971b60f7c","type":"FactorRange"},"y_scale":{"id":"08fa23f5-ccdb-4811-aae3-7e7a3557999a","type":"CategoricalScale"}},"id":"f3c6ef5c-8fc8-423d-ae32-5bb031626309","subtype":"Figure","type":"Plot"},{"attributes":{"callback":null,"tooltips":[["Merch_ID","@ID"],["Revenue","Rs @Sales{0,0.000}"],["Visits","@Count"]]},"id":"76f7b209-8983-43d8-a7f6-96d217013711","type":"HoverTool"},{"attributes":{},"id":"8d2f49f8-19a4-4f2f-bd8e-d38ab5e07201","type":"CategoricalTicker"},{"attributes":{"grid_line_color":{"value":null},"plot":{"id":"f3c6ef5c-8fc8-423d-ae32-5bb031626309","subtype":"Figure","type":"Plot"},"ticker":{"id":"423fd619-16aa-4c1c-92f2-3f43b0508b6e","type":"BasicTicker"}},"id":"3c705b55-1ccb-443a-8f0d-d64826834943","type":"Grid"},{"attributes":{"fill_color":{"value":"#6C69EB"},"height":{"value":0.5},"right":{"field":"Sales"},"y":{"field":"ID"}},"id":"e8d00a34-5945-48fa-9225-a6562477ad92","type":"HBar"},{"attributes":{"callback":null,"tooltips":[["Merch_ID","@ID"],["Revenue","Rs @Sales{0,0.000}"],["Visits","@Count"]]},"id":"de3b2f27-e37f-4b6a-82dd-21acf044db94","type":"HoverTool"},{"attributes":{},"id":"423fd619-16aa-4c1c-92f2-3f43b0508b6e","type":"BasicTicker"},{"attributes":{},"id":"964bb707-8b12-46bc-bcad-92ab516a7a51","type":"BasicTicker"},{"attributes":{"below":[{"id":"fbf71a90-71e2-4ee5-b53e-de0e5ff827fc","type":"LinearAxis"}],"left":[{"id":"83a8c787-ec68-4496-ae53-67b03ba0e31a","type":"CategoricalAxis"}],"outline_line_alpha":{"value":0.2},"renderers":[{"id":"fbf71a90-71e2-4ee5-b53e-de0e5ff827fc","type":"LinearAxis"},{"id":"aeca19b9-3d69-4dfb-ba8a-9e4e25e6a9e6","type":"Grid"},{"id":"83a8c787-ec68-4496-ae53-67b03ba0e31a","type":"CategoricalAxis"},{"id":"4d6774e0-3705-4789-a6ca-a7ac65568347","type":"Grid"},{"id":"c1f39d73-fcf3-4288-bad1-3d5d51851031","type":"BoxAnnotation"},{"id":"5e652ad2-126a-4eb2-ac84-902563c29a80","type":"GlyphRenderer"}],"title":{"id":"cd1f4158-7918-4b54-8b4a-f1e152333437","type":"Title"},"toolbar":{"id":"86cd5a01-af84-4b3b-8e6c-5b9ca89bf54e","type":"Toolbar"},"x_range":{"id":"ac5ff865-bb97-49c1-b48b-458af97677c3","type":"DataRange1d"},"x_scale":{"id":"8441b708-7b9f-4a31-9487-d38bdc4c7300","type":"LinearScale"},"y_range":{"id":"f6f7ea91-f359-4edd-a3d0-4a78c8a5f049","type":"FactorRange"},"y_scale":{"id":"78f4920d-12d8-4da5-b9a6-f7f7c6c60ad4","type":"CategoricalScale"}},"id":"b8da88d1-af1a-412d-bf22-d9b50a23a43e","subtype":"Figure","type":"Plot"},{"attributes":{},"id":"78f4920d-12d8-4da5-b9a6-f7f7c6c60ad4","type":"CategoricalScale"},{"attributes":{},"id":"8cb69d9c-a6f3-456e-ab3f-c66bc12d2753","type":"BasicTickFormatter"},{"attributes":{"source":{"id":"beb6b439-f3a7-4a41-b107-7b7d36a4fc1e","type":"ColumnDataSource"}},"id":"aa29be63-62fc-4116-b133-d905dee2bbdd","type":"CDSView"},{"attributes":{},"id":"b31cafab-420a-43e4-a0ea-7d7ba424f5ba","type":"ResetTool"},{"attributes":{},"id":"84d31a0a-0596-47ea-ad1b-1ec36b760e90","type":"HelpTool"},{"attributes":{"overlay":{"id":"8f60b37d-d8d0-4e4c-a697-7f82d69eb638","type":"BoxAnnotation"}},"id":"d2f923f0-030f-4e05-8f87-58e0e957f447","type":"BoxZoomTool"},{"attributes":{},"id":"08327f98-3e2c-4dc5-a337-6b45bb0026ba","type":"BasicTickFormatter"},{"attributes":{"axis_label":"Sales","axis_line_color":{"value":null},"formatter":{"id":"8cb69d9c-a6f3-456e-ab3f-c66bc12d2753","type":"BasicTickFormatter"},"major_label_text_font_size":{"value":"0pt"},"major_tick_line_color":{"value":null},"minor_tick_line_color":{"value":null},"plot":{"id":"f3c6ef5c-8fc8-423d-ae32-5bb031626309","subtype":"Figure","type":"Plot"},"ticker":{"id":"423fd619-16aa-4c1c-92f2-3f43b0508b6e","type":"BasicTicker"}},"id":"9ba9f5f6-0a75-40cc-93ad-37ce28f66249","type":"LinearAxis"},{"attributes":{"dimension":1,"grid_line_color":{"value":null},"plot":{"id":"f3c6ef5c-8fc8-423d-ae32-5bb031626309","subtype":"Figure","type":"Plot"},"ticker":{"id":"43903bfe-e57a-4209-acff-69fb3ac987d7","type":"CategoricalTicker"}},"id":"c7f4a660-eeb6-4eb5-b196-8dbf00dadca4","type":"Grid"},{"attributes":{},"id":"3f8cfcd2-de17-4926-8cb1-5b0372efe0ca","type":"PanTool"},{"attributes":{"dimension":1,"grid_line_color":{"value":null},"plot":{"id":"b8da88d1-af1a-412d-bf22-d9b50a23a43e","subtype":"Figure","type":"Plot"},"ticker":{"id":"8d2f49f8-19a4-4f2f-bd8e-d38ab5e07201","type":"CategoricalTicker"}},"id":"4d6774e0-3705-4789-a6ca-a7ac65568347","type":"Grid"},{"attributes":{"overlay":{"id":"c1f39d73-fcf3-4288-bad1-3d5d51851031","type":"BoxAnnotation"}},"id":"b7b5c738-7223-4d00-b1e5-6ed7356788c6","type":"BoxZoomTool"},{"attributes":{},"id":"cabfb040-4b40-46c1-81d6-4d3bd56e7620","type":"SaveTool"},{"attributes":{"axis_label":"Merchant","axis_line_color":{"value":null},"formatter":{"id":"b48ce5f5-e469-4147-9531-dc87bf04e2a0","type":"CategoricalTickFormatter"},"plot":{"id":"f3c6ef5c-8fc8-423d-ae32-5bb031626309","subtype":"Figure","type":"Plot"},"ticker":{"id":"43903bfe-e57a-4209-acff-69fb3ac987d7","type":"CategoricalTicker"}},"id":"173a3635-c5d0-4c00-9f28-0fceac107750","type":"CategoricalAxis"},{"attributes":{"callback":null,"factors":["LP","KC","BDR","JHU","LKW","COL","GTK","POW","INM","PH","HO"]},"id":"eab96392-b6f3-485d-a66a-347971b60f7c","type":"FactorRange"},{"attributes":{"active_drag":"auto","active_inspect":"auto","active_scroll":"auto","active_tap":"auto","tools":[{"id":"b8eed6e8-eec8-497e-a2de-62e2e503bec9","type":"PanTool"},{"id":"b5b8c165-97b7-4186-968c-bb716863fcf0","type":"WheelZoomTool"},{"id":"b7b5c738-7223-4d00-b1e5-6ed7356788c6","type":"BoxZoomTool"},{"id":"04a5ee34-c4b3-4091-b330-1b046c590def","type":"SaveTool"},{"id":"33e65275-4a69-48db-93f9-040cf94d504c","type":"ResetTool"},{"id":"833dad25-6dc6-4e36-a9fa-578c58c2885d","type":"HelpTool"},{"id":"de3b2f27-e37f-4b6a-82dd-21acf044db94","type":"HoverTool"}]},"id":"86cd5a01-af84-4b3b-8e6c-5b9ca89bf54e","type":"Toolbar"}],"root_ids":["b8da88d1-af1a-412d-bf22-d9b50a23a43e","f3c6ef5c-8fc8-423d-ae32-5bb031626309"]},"title":"Bokeh Application","version":"0.12.13"}}';
          var render_items = [{"docid":"4679a6cd-12e0-4168-983e-135a2e29f86d","elementid":"db6af978-6cba-4467-89f0-3c71b45488d1","modelid":"f3c6ef5c-8fc8-423d-ae32-5bb031626309"}];
          root.Bokeh.embed.embed_items(docs_json, render_items);

          }
          if (root.Bokeh !== undefined) {
            embed_document(root);
          } else {
            var attempts = 0;
            var timer = setInterval(function(root) {
              if (root.Bokeh !== undefined) {
                embed_document(root);
                clearInterval(timer);
              }
              attempts++;
              if (attempts > 100) {
                console.log("Bokeh: ERROR: Unable to run BokehJS code because BokehJS library is missing")
                clearInterval(timer);
              }
            }, 10, root)
          }
        })(window);
      });
    };
    if (document.readyState != "loading") fn();
    else document.addEventListener("DOMContentLoaded", fn);
  })();
</script>

   </head>
   <body>
      <div class="bk-root">
    <div class="bk-plotdiv" id="db6af978-6cba-4467-89f0-3c71b45488d1"></div>
</div>
   </body>
</html>

鉴于只有docs_json和render_items是唯一的变化值，是否可以使用API​​将它们传递给前端？ 还在前端建立散景图？

0 个答案:

没有答案
相关问题
最新问题