Mastering Development

Create bar graph without in JavaScript

I’m trying to implement this graph with data given below using JavaScript without using <canvas>. I got one bar can’t see the rest. I want at least 4 bars with x-axis and y-axis numbers (not necessary to be true).

const g = document.getElementById("graph");

const graphData = {
  title: "Wild Animals in Istanbul",
  yAxis: "population",
  data: [{
      name: "pigeon",
      value: 30,
      color: "red"
      name: "wolf",
      value: 20,
      color: "blue"

function createGraphIn(g, graphData) {
  const numOfBars =;

  var bar = document.createElement("div"); =[0].color; = "1px solid black"; = "absolute"; = "20px"; = "100px"; = "30px"; =[0].value + "px";


createGraphIn(g, graphData);
div#graph {
  width: 300px;
  height: 150px;
  border: 1px solid black;
  position: relative;
<div id="graph">


Leave a Reply

Your email address will not be published. Required fields are marked *