2012-09-03 16 views
6

मेरे पास Google मानचित्र के साथ एक पृष्ठ का यह वेबब्रोज़र दृश्य है।Google मानचित्र के लिए मीडिया प्रिंट का उपयोग कैसे करें

browser view

तो मैं कुछ @Media प्रिंट शैली

<style type="text/css"> 
     @media print 
     { 
     body{font-family:georgia,times,sans-serif;} 
     img{max-width:500px;} 
     #headerblock{display:none;} 
     #navigationblock{display:none;} 
     #thewaydiv{display:block;} 
     #footerblock{display:none;} 
     #contentmap{min-height:100px; position:relative; width:100%;} 
     #map{border-bottom:0px; border-left:0px; border-top:0px; border-right:0px; height:250px; margin-top:0px; width:100%;} 
     } 
    </style> 

जोड़ लिया है जब मैं तो प्रिंट पेज या प्रिंट दृश्य का उपयोग तो मैं इस मिल: आप के रूप में

print view

देख सकते हैं कि Google मानचित्र पृष्ठ के आकार में ठीक है, लेकिन यह वास्तविक छवि का बहुत बड़ा/छोटा हिस्सा है। मैं इसे कैसे ठीक कर सकता हूं, इसलिए मुझे प्रिंट दृश्य पर ब्राउज़र दृश्य जैसी Google छवि मिलती है?

उत्तर

2

यह सीएसएस का उपयोग करके नहीं किया जा सकता है।

आपको नक्शा के आकार के साथ एक विशेष पृष्ठ की आवश्यकता होगी क्योंकि इसे प्रिंट करना होगा, या प्रिंट करने से पहले मानचित्र को ज़ूम आउट करना होगा (यह जावास्क्रिप्ट का उपयोग करके किया जा सकता है)।

1

मैं भी गतिशील डेटा संचालित नक्शे के साथ इस मुद्दे में भाग गया। हालांकि मुझे एपीआई या क्लंकी अलग नक्शा पेज का उपयोग करके मानचित्र में हेरफेर किए बिना इस काम को थोड़ा आसान बनाने के लिए सीएसएस का उपयोग करने का एक तरीका मिला।

मैंने मानचित्र को परिभाषित ऊंचाई के साथ एक कंटेनर div दिया और इसके सीएसएस ओवरफ्लो को छुपाया। मैंने उसी सेटअप का उपयोग करके पहले के तहत एक दूसरा नक्शा जोड़ा लेकिन 500px ऊंचाई से 700px चौड़ाई जैसे प्रिंट करने योग्य आयाम के साथ।

अंत में प्रिंट स्टाइलशीट बस प्रदर्शित होता है: पहले कंटेनर में दूसरे छिपे हुए मानचित्र को प्रकट करने वाले पहले मानचित्र के लिए कोई भी नहीं।

क्या यह हैकी है?
शायद, लेकिन यह तुरंत मेरे लिए काम किया।

संबंधित मुद्दे