Nodejs > > Contour Plots
Suggest an edit to this page

Contour Plots in Nodejs

How to make a contour plot in nodejs. Seven examples of contour plots of matrices with subplots, custom color-scales, and smoothing.


Basic Contour Plot 

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

var linspace = require('linspace');
var unpack = require('ndarray-unpack');
var zeros = require('zeros');
var fill = require('ndarray-fill');

var size = 100
var x = linspace(-2 * Math.PI, 2 * Math.PI, size)
var y = linspace(-2 * Math.PI, 2 * Math.PI, size)
var z = unpack(zeros([size,size]))
for (var i = 0; i < size; i++) {
  for (var j = 0; j < size; j++) {
    r2 = (x * (i * i) + y * (j * j))
      z[i][j] = Math.sin(x * i) * Math.cos(y * j) * Math.sin(r2) / Math.log(r2+1)
  }
}

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

var data = [
  {
    z: z,
    x: x,
    y: y,
    type: "contour"
  }
];
var graphOptions = {filename: "simple-contour", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});

2D Histogram Contour Plot
with Histogram Subplots 

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

var linspace = require('linspace');

var t = linspace(-1,1.2,2000);
var x = (Math.pow(t, 3)) + (0.3 * (Math.random() * 2000));
var y = (Math.pow(t, 6)) + (0.3 * (Math.random() * 2000));

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

var trace1 = {
  x: x,
  y: y,
  mode: "markers",
  name: "points",
  marker: {
    color: "rgb(102,0,0)",
    size: 2,
    opacity: 0.4
  },
  type: "scatter"
};
var trace2 = {
  x: x,
  y: y,
  name: "density",
  ncontours: 20,
  colorscale: "Hot",
  reversescale: true,
  showscale: false,
  type: "histogram2dcontour"
};
var trace3 = {
  x: x,
  name: "x density",
  marker: {color: "rgb(102,0,0)"},
  yaxis: "y2",
  type: "histogram"
};
var trace4 = {
  y: y,
  name: "y density",
  marker: {color: "rgb(102,0,0)"},
  xaxis: "x2",
  type: "histogram"
};
var data = [trace1, trace2, trace3, trace4];
var layout = {
  showlegend: false,
  autosize: false,
  width: 600,
  height: 550,
  xaxis: {
    domain: [0, 0.85],
    showgrid: false,
    zeroline: false
  },
  yaxis: {
    domain: [0, 0.85],
    showgrid: false,
    zeroline: false
  },
  margin: {t: 50},
  hovermode: "closest",
  bargap: 0,
  xaxis2: {
    domain: [0.85, 1],
    showgrid: false,
    zeroline: false
  },
  yaxis2: {
    domain: [0.85, 1],
    showgrid: false,
    zeroline: false
  }
};
var graphOptions = {layout: layout, filename: "2dhistogram-contour-subplots", fileopt: "overwrite"};
plotly.plot(data, graphOptions, function (err, msg) {
    console.log(msg);
});