इसे समझने में मुझे कुछ समय लगा, लेकिन Google चार्ट समर्थन दोहरी वाई-अक्ष (वी-अक्ष) है। मैं जावास्क्रिप्ट एपीआई का उपयोग करना चाहता हूं, न कि एचटीएमएल इंटरफ़ेस।
यह उदाहरण यहाँ परीक्षण किया जा सकता: http://code.google.com/apis/ajax/playground/?type=visualization#line_chart
इस कोड को दिखा दो अलग Y- अक्ष तराजू के लिए कैसे के साथ कि कोड के सभी बदलें:
function drawVisualization() {
// Create and populate the data table.
var data = new google.visualization.DataTable();
data.addColumn('string', 'x');
data.addColumn('number', 'Cats');
data.addColumn('number', 'Blanket 1');
data.addColumn('number', 'Blanket 2');
data.addRow(["A", 1, 1, 0.5]);
data.addRow(["B", 2, 0.5, 1]);
data.addRow(["C", 4, 1, 0.5]);
data.addRow(["D", 8, 0.5, 1]);
data.addRow(["E", 7, 1, 0.5]);
data.addRow(["F", 7, 0.5, 1]);
data.addRow(["G", 8, 1, 0.5]);
data.addRow(["H", 4, 0.5, 1]);
data.addRow(["I", 2, 1, 0.5]);
data.addRow(["J", 3.5, 0.5, 1]);
data.addRow(["K", 3, 1, 0.5]);
data.addRow(["L", 3.5, 0.5, 1]);
data.addRow(["M", 1, 1, 0.5]);
data.addRow(["N", 1, 0.5, 1]);
// Create and draw the visualization.
new google.visualization.LineChart(document.getElementById('visualization')).
draw(data, {curveType: "function", width: 500, height: 400,
vAxes: {0: {logScale: false},
1: {logScale: false, maxValue: 2}},
series:{
0:{targetAxisIndex:0},
1:{targetAxisIndex:1},
2:{targetAxisIndex:1}}}
);
}
कोड को maxValue: 2
को जोड़ कर, और उस धुरी के लिए श्रृंखला 1 & 2 सेट करना, वे दूसरी धुरी पर ठीक से काम करते हैं।
ध्यान दें कि उपर्युक्त उदाहरण दो अलग-अलग वाई-अक्ष स्केल नहीं दिखाता है (यह कहने के बावजूद) क्योंकि दूसरा vAxis अधिकतम वैल्यू पर सेट है: 10, यदि आप दो अधिकतम VAxes को अधिकतम maxValue मानों पर सेट करते हैं तो आप दो अलग-अलग देखेंगे तराजू। –
@JamieKitson उत्तर अब करता है। किसी को इसे संपादित करना चाहिए –
मैंने कोशिश की लेकिन मेरे संपादन अस्वीकार कर दिए गए आईआईआरसी: -/ –