angularjs - Angular-nvd3-directives adjust height of the chart according to the width of the chart -


मैं कोणीतरी-एनवीडी 3-निर्देशों का उपयोग कर एक लाइन चार्ट बनाने का प्रयास कर रहा / रही हूं। इसे अच्छी तरह से देखने के लिए मुझे ऊंचाई विशेषता को "250" पर सेट करने की आवश्यकता है, जो अच्छा बड़े और मध्यम स्क्रीन दिखता है। लेकिन, छोटी स्क्रीन पर यह अजीब दिखाई देगा क्योंकि ऊँचाई तय हो गई है, और चौड़ाई वैल्यू बहुत छोटा होगी, फिर ऊंचाई यदि मूल्य के लिए ऊंचाई की विशेषता सेट न करें, तो यह बहुत व्यापक होगा मैं चाहता हूँ कि y- अक्ष की ऊंचाई चार्ट के चौड़ाई के समान मूल्य के समान हो। क्या यह संभव है? या फिर इसका समाधान करने का कोई अन्य तरीका क्या है?

यहां एक ऐसा प्लंकर है जो समस्या को दर्शाता है

HTML 

  & Lt; div वर्ग = "कंटेनर" & gt; & Lt; div id = "topgraph" वर्ग = "पंक्ति अच्छी तरह से" & gt; & Lt; div वर्ग = "col-md-6" & gt; & Lt; div ng-controller = "report" & gt; & Lt; nvd3-line-chart डेटा = "चार्टडाटा" id = "report3" showXAxis = "true" showYXx = "true" टूलटिप्स = "सही" मार्जिन = "{बाएं: 90, शीर्ष: 20, नीचे: 20, सही: 20} "ऊंचाई =" 250 "& gt; & Lt;! - मैं उस विशेषता को चौड़ाई के अनुसार समायोजित करना चाहता हूं - & gt; & LT; svg & gt; & lt; / svg & gt; & Lt; / nvd3-लाइन-चार्ट & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; div वर्ग = "col-md-6" & gt; & Lt; h3 शैली = "मार्जिन-टॉप: 2em;" & gt; सांख्यिकी & lt; / h3 & gt; & LT; ul & gt; & Lt; li & gt; प्रति दिन एवरेज पोस्ट: & lt; मजबूत & gt; 4 & lt; / strong & gt; & Lt; / li & gt; & Lt; li & gt; अधिकतम पोस्ट प्रति दिन: & lt; मजबूत & gt; 3 & lt; / strong & gt; & Lt; / li & gt; & Lt; li & gt; प्रति दिन न्यूनतम पोस्ट: & lt; मजबूत & gt; 2 & lt; / strong & gt; & Lt; / li & gt; & Lt; li & gt; पदों की संख्या: & lt; मजबूत & gt; 1 & lt; / strong & gt; & Lt; / li & gt; & Lt; / ul & gt; & Lt; / div & gt; & Lt; / div & gt; & Lt; / div & gt;

जावास्क्रिप्ट 

  var ऐप = कोणीय। मॉड्यूल ('ऐप', ['एनवीडी 3 चार्ट डायरेक्टिव्स']); App.controller ('रिपोर्ट', ['$ scope', रिपोर्ट]); फ़ंक्शन रिपोर्ट ($ दायरा) {$ scope.chartData = [{"कुंजी": "कुंजी 1", "मान": [[1, 150000.0], [2, 1000000.0], [3, 1071000.0], [4, 1271000.0] , [5, 1371000.0], [6, 1471000.0], [7, 1571000.0], [8, 1671000.0], [9, 1771000.0], [10, 1871000.0], [11, 1 9 71000.0], [12, 2271000.0]]} , {"कुंजी": "कुंजी 2", "मूल्य": [[1, 150000.0], [2, 1200000.0], [3, 1371000.0], [4, 1 9 71000.0], [5, 1371000.0], [6, 1471000.0 ], [7, 1571000.0], [8, 1671000.0], [9, 1771000.0], [10, 1871000.0], [11, 1971, 000.0], [12, 2271000.0]]}]}
< P> यह पहली बार मैंने एक लिंक्ड लिखा है, लेकिन मुझे उम्मीद है कि यह मेरा इरादा है जैसा काम करता है

चार्ट पर सभी ऊंचाई और चौड़ाई विशेषताओं को निकालें यह अपने कंटेनर के लिए स्वत: आकार होगा।

फिर आप इच्छित पहलू अनुपात को प्राप्त करने के लिए कंटेनर पर सामान्य सीएसएस का उपयोग करें।


-

Comments

Post a Comment

Popular posts from this blog

Docker - Tomcat and PostgreSQL containers in same host - No Route to host -

I have a web application running on Tomcat and has started the container using the command, Docker run -d -p 8080: 8080 tveuser / tve-repository: tve-services I also run a PostgreSQL container on the same host using the following command am: Docker run-D-P 80: 80-P-5432: 5432 Tivejhr / Tive-repository: TV-post-Jiaracl I Verify that PostgreSQL is running using phpPgAdmin but Neither could it find the tomato to connect. 'Docker PS' also tells me that both the containers are up and running. I connect the web entry to the database through the TOKamet Reference.XML which contains the entry & lt; Parameter Name = "abc.connection.url" value = "jdbc: postgresql: //1.2.3.4: 5432 / dbname" /> Where 1.2.3.4 is the Dockers Host IP in which the Container is Running. But when I run the Tomcat Container, I get the following error: Org.postgresql.util.PSQLException: The connection attempt failed. On Org.postgresql.core.v3.ConnectionFactoryI...
Read more

Python Equivalent for matlab cart2pol and pol2cart -

I would like to use pol2cart and cart2pol for two functions in MATLAB. Is there an equivalent Python Function? Or if we can define work? For example, I tried to use the CeMatePactor function, but it only accepts one argument, I have 2 arguments to cross the polar and REC function. P> I have tried to use this function for cart2pol: def cart2pol (x, y): theta = atan2 (y, x) rho = Sqrt (x ** 2 + y ** 2) returns (theta, ro) thanks
Read more

java - Joda Time Interval Not returning what I expect -

मेरे पास निम्न प्रोग्राम है import java.util। *; Import java.text। *; आयात करें org.joda.time। *; सार्वजनिक श्रेणी के स्कोप कंट्रोल {सार्वजनिक स्थिर अंतराल मिलनसार () {दिनांक समय currDate = नया दिनांक समय (2008, 4, 4, 15, 30, 0, 0); दिनांक समय epochDate = नया दिनांकटाइम (2000, 1, 1, 12, 0, 0, 0); अंतराल अंतराल = नया अंतराल (युरोप डेट, करोडेट); वापसी अंतराल; } सार्वजनिक स्थिर शून्य मुख्य (स्ट्रिंग [] आर्ग्स) {डबल दिनबात = मिलते समय ()। ToDurationMillis () / 1000/60/60/24; StdOut.println (daysBtween); }} मुझे आउटपुट मिल रहा है: 3016.0 लेकिन जो मैं देख रहा हूं वह है: 3016.1458333333 मैं क्या कर रहा हूँ ? toDurationMillis एक लंबा लौटा देता है, और प्रत्येक प्रभाग को int के रूप में घोषित किया जाता है। जावा इस प्रकार इनट्स को लॉन्ग में परिवर्तित कर देगा और डिवीजन को लंबे समय तक लौटाना होगा। परिणाम को अंत में दोहरे रूप में परिवर्तित करना। डबल्स का उपयोग करके अभिव्यक्ति करने के लिए जावा को बताने के लिए, अभिव्यक्ति के किसी भी घटक को दोहरे रूप में घोषित करें। उदाहरण के लिए: ...
Read more