簡體   English   中英

如何在谷歌圖表中添加新的Y比例尺

[英]How to add a new Y scale in google chart

我已經在stackoverflow帖子中嘗試了很多答案,但是我無法在Google圖表中添加另一個Y比例尺,有人可以幫我嗎?

這是我當前的輸出:

screenshot1

我需要以下輸出:

screenshot2

//here you can put data in javascript format
//String, int, int
var data = google.visualization.arrayToDataTable([
    ['Week', 'IE/Week',{ role: 'style' }, { role: 'annotation' }, { role: 'style' }, 'IE/Day', { role: 'style' }, { role: 'annotation' }],
    [ week1,  valuer1, '#5A9AD4', valuer1, '#000000', valueDay1, '#ED7D30', valueDay1],
    [ week2,  valuer2, '#5A9AD4', valuer2, '#000000', valueDay2, '#ED7D30', valueDay2],
    [ week3,  valuer3, '#5A9AD4', valuer3, '#000000', valueDay3, '#ED7D30', valueDay3],
    [ week4,  valuer4, '#5A9AD4', valuer4, '#000000', valueDay4, '#ED7D30', valueDay4],
    [ week5,  valuer5, '#5A9AD4', valuer5, '#000000', valueDay5, '#ED7D30', valueDay5]
]);

var options = {
        annotations: {
            textStyle: {
              fontSize: 16,
              bold: true,
              color: 'black'
            }
          },
  title : 'IE Trends Weekly and Daily',
  titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: '18', fontWidth: 'normal'},
  vAxes: { 0: {logScale: false}, 1: {logScale: false}},
  vAxes: { 1: {logScale: false}, 2: {logScale: false}},
  series:{
      titleTextStyle: {color: 'black'},
      0:{targetAxisIndex:0},
      1:{targetAxisIndex:1}
  },
  pointSize:8,
  color: 'black',
  lineWidth: 2,
  hAxis: {title: ''},

  seriesType: 'bars',
  series: {0: {type: 'bar'}, 1: {type: 'line'}}
};

var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);

你近了 您在選項對象中兩次定義了鍵“系列”,從而覆蓋了先前定義的“ targetAxisIndex”。 嘗試以下選項: jsfiddle

//here you can put data in javascript format
//String, int, int
var data = google.visualization.arrayToDataTable([
    ['Week', 'IE/Week',{ role: 'style' }, { role: 'annotation' }, { role: 'style' }, 'IE/Day', { role: 'style' }, { role: 'annotation' }],
    [ week1,  valuer1, '#5A9AD4', valuer1, '#000000', valueDay1, '#ED7D30', valueDay1],
    [ week2,  valuer2, '#5A9AD4', valuer2, '#000000', valueDay2, '#ED7D30', valueDay2],
    [ week3,  valuer3, '#5A9AD4', valuer3, '#000000', valueDay3, '#ED7D30', valueDay3],
    [ week4,  valuer4, '#5A9AD4', valuer4, '#000000', valueDay4, '#ED7D30', valueDay4],
    [ week5,  valuer5, '#5A9AD4', valuer5, '#000000', valueDay5, '#ED7D30', valueDay5]
    ]);

var options = {
  annotations: {
    textStyle: {
      fontSize: 16,
      bold: true,
      color: 'black'
  }
},
title : 'IE Trends Weekly and Daily',
titleTextStyle: {color: 'black', fontName: 'Arial', fontSize: '18', fontWidth: 'normal'},
vAxes: { 0: {logScale: false}, 1: {logScale: false}},
vAxes: { 1: {logScale: false}, 2: {logScale: false}},
series:{
    titleTextStyle: {color: 'black'},
    0: { type: 'bar', targetAxisIndex:0},
    1: { type: 'line', targetAxisIndex:1}
},
pointSize:8,
color: 'black',
lineWidth: 2,
hAxis: {title: ''},

seriesType: 'bars'
};

var chart = new google.visualization.ComboChart(document.getElementById('chart_div'));
chart.draw(data, options);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM