Line and Scatter Plots in Nodejs

How to make line and scatter plots in nodejs. Seven examples of basic and colored line and scatter plots.


// Learn about API authentication here: https://plotly.com/nodejs/getting-started
// Find your api_key here: https://plotly.com/settings/api

require('plotly')(username, api_key);

var trace1 = {
  x: [1, 2, 3, 4],
  y: [10, 15, 13, 17],
  type: "scatter"
};
var trace2 = {
  x: [1, 2, 3, 4],
  y: [16, 5, 11, 9],
  type: "scatter"
};
var data = [trace1, trace2];
var graphOptions = {filename: "basic-line", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plotly.com/nodejs/getting-started
// Find your api_key here: https://plotly.com/settings/api

require('plotly')(username, api_key);

var trace1 = {
  x: [1, 2, 3, 4],
  y: [10, 15, 13, 17],
  mode: "markers",
  type: "scatter"
};
var trace2 = {
  x: [2, 3, 4, 5],
  y: [16, 5, 11, 9],
  mode: "lines",
  type: "scatter"
};
var trace3 = {
  x: [1, 2, 3, 4],
  y: [12, 9, 15, 12],
  mode: "lines+markers",
  type: "scatter"
};
var data = [trace1, trace2, trace3];
var graphOptions = {filename: "line-scatter", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plotly.com/nodejs/getting-started
// Find your api_key here: https://plotly.com/settings/api

require('plotly')(username, api_key);

var trace1 = {
  x: [52698, 43117],
  y: [53, 31],
  mode: "markers",
  name: "North America",
  text: ["United States", "Canada"],
  marker: {
    color: "rgb(164, 194, 244)",
    size: 12,
    line: {
      color: "white",
      width: 0.5
    }
  },
  type: "scatter"
};
var trace2 = {
  x: [39317, 37236, 35650, 30066, 29570, 27159, 23557, 21046, 18007],
  y: [33, 20, 13, 19, 27, 19, 49, 44, 38],
  mode: "markers",
  name: "Europe",
  text: ["Germany", "Britain", "France", "Spain", "Italy", "Czech Rep.", "Greece", "Poland"],
  marker: {
    color: "rgb(255, 217, 102)",
    size: 12,
    line: {
      color: "white",
      width: 0.5
    }
  },
  type: "scatter"
};
var trace3 = {
  x: [42952, 37037, 33106, 17478, 9813, 5253, 4692, 3899],
  y: [23, 42, 54, 89, 14, 99, 93, 70],
  mode: "markers",
  name: "Asia/Pacific",
  text: ["Australia", "Japan", "South Korea", "Malaysia", "China", "Indonesia", "Philippines", "India"],
  marker: {
    color: "rgb(234, 153, 153)",
    size: 12,
    line: {
      color: "white",
      width: 0.5
    }
  },
  type: "scatter"
};
var trace4 = {
  x: [19097, 18601, 15595, 13546, 12026, 7434, 5419],
  y: [43, 47, 56, 80, 86, 93, 80],
  mode: "markers",
  name: "Latin America",
  text: ["Chile", "Argentina", "Mexico", "Venezuela", "Venezuela", "El Salvador", "Bolivia"],
  marker: {
    color: "rgb(142, 124, 195)",
    size: 12,
    line: {
      color: "white",
      width: 0.5
    }
  },
  type: "scatter"
};
var data = [trace1, trace2, trace3, trace4];
var layout = {
  title: "Quarter 1 Growth",
  xaxis: {
    title: "GDP per Capita",
    showgrid: false,
    zeroline: false
  },
  yaxis: {
    title: "Percent",
    showline: false
  }
};
var graphOptions = {layout: layout, filename: "line-style", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plotly.com/nodejs/getting-started
// Find your api_key here: https://plotly.com/settings/api

require('plotly')(username, api_key);

var trace1 = {
  x: [1, 2, 3, 4, 5],
  y: [1, 3, 2, 3, 1],
  mode: "lines+markers",
  name: "'linear'",
  line: {shape: "linear"},
  type: "scatter"
};
var trace2 = {
  x: [1, 2, 3, 4, 5],
  y: [6, 8, 7, 8, 6],
  mode: "lines+markers",
  name: "'spline'",
  text: ["tweak line smoothness<br>with 'smoothing' in line object", "tweak line smoothness<br>with 'smoothing' in line object", "tweak line smoothness<br>with 'smoothing' in line object", "tweak line smoothness<br>with 'smoothing' in line object", "tweak line smoothness<br>with 'smoothing' in line object", "tweak line smoothness<br>with 'smoothing' in line object"],
  line: {shape: "spline"},
  type: "scatter"
};
var trace3 = {
  x: [1, 2, 3, 4, 5],
  y: [11, 13, 12, 13, 11],
  mode: "lines+markers",
  name: "'vhv'",
  line: {shape: "vhv"},
  type: "scatter"
};
var trace4 = {
  x: [1, 2, 3, 4, 5],
  y: [16, 18, 17, 18, 16],
  mode: "lines+markers",
  name: "'hvh'",
  line: {shape: "hvh"},
  type: "scatter"
};
var trace5 = {
  x: [1, 2, 3, 4, 5],
  y: [21, 23, 22, 23, 21],
  mode: "lines+markers",
  name: "'vh'",
  line: {shape: "vh"},
  type: "scatter"
};
var trace6 = {
  x: [1, 2, 3, 4, 5],
  y: [26, 28, 27, 28, 26],
  mode: "lines+markers",
  name: "'hv'",
  line: {shape: "hv"},
  type: "scatter"
};
var data = [trace1, trace2, trace3, trace4, trace5, trace6];
var layout = {legend: {
    y: 0.5,
    traceorder: "reversed",
    font: {size: 16},
    yref: "paper"
  }};
var graphOptions = {layout: layout, filename: "line-shapes", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});