mark bar. Enable Vega-Lite under Libraries, wait until it is checked, then paste the whole editor.

Goal

Run every block and confirm the chart is visible.

document.body.innerHTML = '<div id="vis"></div>';
vegaEmbed("#vis", {
  $schema: "https://vega.github.io/schema/vega-lite/v5.json",
  data: { values: [{c:"Nairobi",u:21,s:2100},{c:"Mombasa",u:15,s:1500},{c:"Kisumu",u:15,s:1480},{c:"Nakuru",u:18,s:1750},{c:"Eldoret",u:12,s:1190}] },
  mark: 'bar',
  encoding: { x: { field: "c", type: "nominal" }, y: { field: "u", type: "quantitative" } }
});
console.log('bar');

document.body.innerHTML = '<div id="vis"></div>';
vegaEmbed("#vis", { $schema: "https://vega.github.io/schema/vega-lite/v5.json", data: { values: [{c:"Nairobi",u:21,s:2100},{c:"Mombasa",u:15,s:1500},{c:"Kisumu",u:15,s:1480},{c:"Nakuru",u:18,s:1750},{c:"Eldoret",u:12,s:1190}] }, mark: "bar", encoding: { x: { field: "c" }, y: { field: "u", type: "quantitative" } } });
console.log("bar");

document.body.innerHTML = '<div id="vis"></div>';
vegaEmbed("#vis", { $schema: "https://vega.github.io/schema/vega-lite/v5.json", data: { values: [{m:"Jan",mm:48,city:"Nairobi"},{m:"Feb",mm:55,city:"Nairobi"},{m:"Mar",mm:92,city:"Nairobi"},{m:"Apr",mm:150,city:"Nairobi"},{m:"Jan",mm:22,city:"Mombasa"},{m:"Feb",mm:18,city:"Mombasa"},{m:"Mar",mm:40,city:"Mombasa"},{m:"Apr",mm:80,city:"Mombasa"}] }, mark: "line", encoding: { x: { field: "m" }, y: { field: "mm", type: "quantitative" }, color: { field: "city" } } });
console.log("line");

console.log('bar');