Plotly.js将条形图添加到条形图使条形图消失

时间:2016-09-30 16:43:58

标签: javascript plotly

我创建了一个可以按照我想要的方式正常工作的条形图。现在,我试图添加一个线图来重叠条形图,但是当我运行代码时,线条图出现了,但条形图消失了。添加线图似乎很简单,但由于某种原因,它不起作用。我也没有在控制台上犯任何错误。

var x_text = ["Comodities","Consumer Discretionary","Utilities",
              "Health & Biotech","Global Real Estate","Financials",
              "Emerging Market Bonds","Technologies","Industrials",
              "Oil & Gas","China Equities","S&P500"];
  //             
  var trace1 = [{ 

    x: x_text, // X axis (names)
    y: zValues, // Values (y axis)
    hoverinfo: zValues, 
    type: 'bar',
    orientation:"v",
    marker: {
    color: color_list, // Color of bars
    line: {
      color: 'rbg(8,48,107)',
      width: 1
    }},
    yauto: false,
    showscale: true,
  }];

  var trace2 = {
  x: x_text,
  y: [-0.1,-0.1,2.3,3.3,1.0,0.4,0.9,3.0,-0.1,-1.4,3.0,0.2],
  mode: 'lines',
  line:{
    color:'black'
  },
  type: 'scatter'
};


  var layout = {
    font:{
      // Text size and color
      size:16,
      family:'helvetica',
      color: "white"
    },
    annotations: arrow(),
    xaxis:  {
      side: 'bottom',
      orientation: "right"
    },
    yaxis: {
      autosize: true,
      tickfont: "white",
      ticksuffix: "%",
      // Y axis scale
      autorange: false,
      range :[-20,20]
    },
    // Graph position
    margin: {
    l: 90,
    r: 90,
    b: 120,
    t: 20,
    pad: 10
  },
    // Graph background colors
    paper_bgcolor: "transparent", 
    plot_bgcolor:"transparent", 
  };

var data = [trace1, trace2];

Plotly.newPlot('myDiv',data,layout);

1 个答案:

答案 0 :(得分:0)

哦,我的trace1在值周围有大括号+花括号,只适用于条形图,但在调用线图时它会消失。