Bokehjs not working with angular app...]

I am using @bokeh/bokehjs(3.1.0) in angular app(15.0) got some dependency that has resolved by following suggestion referred from community discussion…
npm i @bokeh/slickgrid @bokeh/numbro timezone choices.js flatpickr mathjax-full nouislider regl flatbush proj4 hammerjs underscore.template

and written below code in component constructor
var x = Bokeh.LinAlg.linspace(-0.5, 20.5, 10);

  var y = (v:number) { return v * 0.5 + 3.0; });

  var source = new Bokeh.ColumnDataSource({ data: { x: x, y: y } });


  // create some ranges for the plot

  var xdr = new Bokeh.Range1d({ start: -0.5, end: 20.5 });

  var ydr =  new Bokeh.Range1d({ start: -0.5, end: 20.5 });


  // make the plot

  var plot = new Bokeh.Plot({

      title: "BokehJS Plot",

      x_range: xdr,

      y_range: ydr,

      background_fill_color: "#F2F2F7"



  // add axes to the plot

  var xaxis = new Bokeh.LinearAxis({ axis_line_color: null });

  var yaxis = new Bokeh.LinearAxis({ axis_line_color: null });

  plot.add_layout(xaxis, "below");

  plot.add_layout(yaxis, "left");


  // add grids to the plot

  var xgrid = new Bokeh.Grid({ ticker: xaxis.ticker, dimension: 0 });

  var ygrid = new Bokeh.Grid({ ticker: yaxis.ticker, dimension: 1 });




  // add a Line glyph

  var line = new Bokeh.Line({

      x: { field: "x" },

      y: { field: "y" },

      line_color: "#666699",

      line_width: 2


  plot.add_glyph(line, source);


  // add the plot to a document and display it

  var doc = new Bokeh.Document();


  var div = document.getElementById("myplot");

  Bokeh.embed.add_document_standalone(doc, div);

getting below error-
ERROR Error: Uncaught (in promise): TypeError: Cannot read properties of undefined (reading ‘connect’)
TypeError: Cannot read properties of undefined (reading ‘connect’)
at GlyphRendererView.connect (view.js:30:23)
at GlyphRendererView.connect_signals (glyph_renderer.js:135:14)
at build_views.js:34:14
at ()
at asyncGeneratorStep (asyncToGenerator.js:3:1)
at _next (asyncToGenerator.js:22:1)
at _ZoneDelegate.invoke (zone.js:375:26)
at Object.onInvoke (core.mjs:24205:33)
at _ZoneDelegate.invoke (zone.js:374:52)
at (zone.js:134:43)
at resolvePromise (zone.js:1214:31)
at zone.js:1121:17
at zone.js:1137:33
at asyncGeneratorStep (asyncToGenerator.js:6:1)
at _throw (asyncToGenerator.js:25:1)
at _ZoneDelegate.invoke (zone.js:375:26)
at Object.onInvoke (core.mjs:24205:33)
at _ZoneDelegate.invoke (zone.js:374:52)
at (zone.js:134:43)
at zone.js:1278:36
handleError @ core.mjs:8416

how I can resolve above error…?

cc @mateusz

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.