एक HTML पृष्ठ पर एकाधिक mpld3 निर्यात प्रदर्शित करें

Question

मुझे mpld3 पैकेज matplolib एचटीएमएल के लिए प्लॉट निर्यात करने और flask ऐप के माध्यम से प्रदर्शित करने के लिए शानदार होने के लिए मिला है।

प्रत्येक निर्यात बहुत सारे जेएस के साथ आता है जो अनावश्यक डुप्लिकेशंस लगता है यदि आप एक ही पृष्ठ में एकाधिक प्लॉट प्रदर्शित करना चाहते हैं। हालांकि मैं प्रासंगिक घटकों को निकालने के लिए जेएस में पर्याप्त रूप से पर्याप्त नहीं हूं और फिर उनके माध्यम से लूप करता हूं। .fig_to_dict विधि प्रत्येक चार्ट को प्रदर्शित करने के लिए आवश्यक JSON देता है लेकिन फिर मैं सोच रहा हूं कि प्रत्येक चार्ट को बदले में जेएस/टेम्पलेट कार्य की आवश्यकता है।

मुझे लगता है कि प्रत्येक साजिश को एक बड़े आंकड़े में ढंकना है, लेकिन मैं चार्ट को अलग-अलग डीआईवी में लेआउट करना चाहता हूं और इसलिए यह सही समाधान नहीं है।

मुझे लगता है कि मैं देख सकता हूं कि जेएस उन्हें प्रदर्शित करने के लिए क्या कर रहा है लेकिन मेरे पास उद्देश्य के अनुरूप कार्यों को संशोधित करने के लिए पर्याप्त ज्ञान नहीं है।

मैंने कोड शामिल नहीं किया है क्योंकि मुझे उम्मीद है कि यह केवल mpld3 अनुभव वाले किसी व्यक्ति के लिए प्रासंगिक होगा लेकिन यदि आवश्यक हो तो कुछ नमूना कोड प्रदान कर सकता है। mpld3.fig_to_html(fig, template_type="simple") के लिए

नमूना HTML उत्पादन:

<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> 
<script type="text/javascript" src="http://mpld3.github.io/js/mpld3.v0.1.js"></script> 
<style> 
</style> 
<div id="fig136845463888164451663379"></div> 
<script type="text/javascript"> 
    var spec136845463888164451663379 = { <snip JSON code> }; 
    var fig136845463888164451663379 = mpld3.draw_figure("fig136845463888164451663379", spec136845463888164451663379); 
</script> 

मैंने सोचा था यह टेम्पलेट हैडर से दो प्रमुख स्क्रिप्ट जोड़ने और फिर प्रत्येक JSON निर्यात के लिए एक नई स्क्रिप्ट बनाने के रूप में सरल हो जाएगा। लेकिन उसने मेरे लिए काम नहीं किया है।

Answer 1

आप अपने उत्तर के साथ आधे रास्ते हैं। मुझे लगता है कि आप क्या करना चाहते हैं कुछ इस तरह, पृष्ठ पर तीन आंकड़े एम्बेड कर देंगे जो है:

<script type="text/javascript" src="http://d3js.org/d3.v3.min.js"></script> 
<script type="text/javascript" src="http://mpld3.github.io/js/mpld3.v0.1.js"></script> 
<style> 
</style> 
<div id="fig01"></div> 
<div id="fig02"></div> 
<div id="fig03"></div> 
<script type="text/javascript"> 
    var json01 = { <snip JSON code> }; 
    var json02 = { <snip JSON code> }; 
    var json03 = { <snip JSON code> }; 
    mpld3.draw_figure("fig01", json01); 
    mpld3.draw_figure("fig02", json02); 
    mpld3.draw_figure("fig03", json03); 
</script> 

प्रत्येक आंकड़ा अजगर में बनाया जा सकता है के लिए json कोड

import json 

# ... create matplotlib figure 

json01 = json.dumps(mpld3.fig_to_dict(fig)) 

इस एम्बेड चलाकर आपके द्वारा बनाए जा रहे HTML दस्तावेज़ में उचित स्थान पर स्ट्रिंग करें, और आपको जाने के लिए अच्छा होना चाहिए। मुझे आशा है कि वह मदद करेंगे!

Answer 2

ध्यान दें कि चूंकि जेकव्डप का उत्तर पोस्ट किया गया था mpld3 की एक नई रिलीज हुई है। आज के रूप में (सितंबर 2014) mpld3 में शामिल होना चाहिए:

<script type="text/javascript" src="http://mpld3.github.io/js/mpld3.v0.2.js"></script>