Plotly is free for unlimited public use. Sign up for free!

Sensitive data? Upgrade to a paid plan

Show Sidebar Hide Sidebar
Node.js

Axes in Nodejs

How to adjust axes properties in nodejs. Seven examples of linear and logarithmic axes, axes titles, and styling and coloring axes and grid lines.

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

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {
    autorange: true,
    showgrid: false,
    zeroline: false,
    showline: false,
    autotick: true,
    ticks: "",
    showticklabels: false
  },
  yaxis: {
    autorange: true,
    showgrid: false,
    zeroline: false,
    showline: false,
    autotick: true,
    ticks: "",
    showticklabels: false
  }
};
var graphOptions = {layout: layout, filename: "axes-booleans", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var data = [
  {
    x: [1, 2],
    y: [1, 2],
    type: "scatter"
  }
];
var layout = {xaxis: {autorange: "reversed"}};
var graphOptions = {layout: layout, filename: "axes-reversed", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {
    type: "log",
    autorange: true
  },
  yaxis: {
    type: "log",
    autorange: true
  }
};
var graphOptions = {layout: layout, filename: "axes-range-type", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var data = [
  {
    x: [2, 4, 6],
    y: [-3, 0, 3],
    type: "scatter"
  }
];
var layout = {
  showlegend: false,
  xaxis: {
    rangemode: "tozero",
    autorange: true
  },
  yaxis: {
    rangemode: "nonnegative",
    autorange: true
  }
};
var graphOptions = {layout: layout, filename: "axes-range-mode", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {range: [2, 5]},
  yaxis: {range: [2, 5]}
};
var graphOptions = {layout: layout, filename: "axes-range-manual", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {
    showgrid: true,
    zeroline: true,
    showline: true,
    mirror: "ticks",
    gridcolor: "#bdbdbd",
    gridwidth: 2,
    zerolinecolor: "#969696",
    zerolinewidth: 4,
    linecolor: "#636363",
    linewidth: 6
  },
  yaxis: {
    showgrid: true,
    zeroline: true,
    showline: true,
    mirror: "ticks",
    gridcolor: "#bdbdbd",
    gridwidth: 2,
    zerolinecolor: "#969696",
    zerolinewidth: 4,
    linecolor: "#636363",
    linewidth: 6
  }
};
var graphOptions = {layout: layout, filename: "axes-lines", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {
    title: "AXIS TITLE",
    titlefont: {
      family: "Arial, sans-serif",
      size: 18,
      color: "lightgrey"
    },
    showticklabels: true,
    tickangle: 45,
    tickfont: {
      family: "Old Standard TT, serif",
      size: 14,
      color: "black"
    },
    exponentformat: "e",
    showexponent: "All"
  },
  yaxis: {
    title: "AXIS TITLE",
    titlefont: {
      family: "Arial, sans-serif",
      size: 18,
      color: "lightgrey"
    },
    showticklabels: true,
    tickangle: 45,
    tickfont: {
      family: "Old Standard TT, serif",
      size: 14,
      color: "black"
    },
    exponentformat: "e",
    showexponent: "All"
  }
};
var graphOptions = {layout: layout, filename: "axes-labels", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
// Learn about API authentication here: https://plot.ly/nodejs/getting-started
// Find your api_key here: https://plot.ly/settings/api

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

var trace1 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [8, 7, 6, 5, 4, 3, 2, 1, 0],
  type: "scatter"
};
var trace2 = {
  x: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  y: [0, 1, 2, 3, 4, 5, 6, 7, 8],
  type: "scatter"
};
var data = [trace1, trace2];
var layout = {
  xaxis: {
    autotick: false,
    ticks: "outside",
    tick0: 0,
    dtick: 0.25,
    ticklen: 8,
    tickwidth: 4,
    tickcolor: "#000"
  },
  yaxis: {
    autotick: false,
    ticks: "outside",
    tick0: 0,
    dtick: 0.25,
    ticklen: 8,
    tickwidth: 4,
    tickcolor: "#000"
  }
};
var graphOptions = {layout: layout, filename: "axes-ticks", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});
Still need help?
Contact Us

For guaranteed 24 hour response turnarounds, upgrade to a Developer Support Plan.