CodePen Embed - Plotly.js Basic Funnel Plot

<head>
	<!-- Load plotly.js into the DOM -->
	<script src='https://cdn.plot.ly/plotly-latest.min.js'></script>
</head>

<body>
	<div id='plot'><!-- Plotly chart will be drawn inside this DIV --></div>
</body>

#plot
  display: inline-block

View Compiled

const gd = document.getElementById('myDiv');
const data = [{type: 'funnel', y: ["Cart", "Billing and Shipping", "Payment", "Review", "Purchase Completed"], x: [1672, 302, 149, 33, 18], textposition: "outside", textinfo: "value+percent initial", hoverinfo: 'x+percent previous+percent initial'}];

const layout = {
  margin: {
    l: 150, pad: 0
  },
  width:900,
  height: 500
}

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

This Pen is owned by Ceyhun Enki Aksan on CodePen.

See more by @ceaksan on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.