Candlestick chart with BokehJS

Hello,

I am trying to generate a candlestick chart using BokehJS and have a problem with vbar glyph, more specifically, I get this error: “Uncaught TypeError: plot.vbar is not a function”. It works fine with a segment glyph. Any help is highly appreciated.

var width = 12151000;

var source = new Bokeh.ColumnDataSource({

data: { x: [Math.random()], o: [Math.random()],

    h: [Math.random()], l: [Math.random()],

    c: [Math.random()], w: width}

});

var tools = “pan,crosshair,wheel_zoom,box_zoom,reset”;

var plot = Bokeh.Plotting.figure({title:‘Example of Random data’,

			  x_axis_type:'datetime',

			  tools: tools, height: 300, width: 900});

var segment = plot.segment({field: “x”},

		   {field: "h"},

		   {field: "x"},

		   {field: "l"},

		   {source:source});

var vbar = plot.vbar({field: “x”},

	     {field: "w"},

	     {field: "o"},

	     {field: "c"},

	     {source:source});

Bokeh.Plotting.show(plot, document.getElementById(‘bk_plot’));

function getCandles(){

$.ajax({

type: "POST",

url: "/get_data",

contentType: 'application/json; charset=UTF-8',

 success: function(response){

     source.data.x = response.time;

     source.data.o = response.o;

     source.data.h = response.h;

     source.data.l = response.l;

     source.data.c = response.c;

     source.trigger('change')

},

error: function(error){

    console.log(error);

}

});

}

``

Hi,

It does not look as thought the BokehJS "plotting" API has been updated to add vbar/hbar yet. This should be a fairly simple thing to do, so I'd encourage you to open an issue on GitHub about it so that the work can be prioritized and tracked. In the mean, you can either:

* use the lower level Models API (e.g. VBar and HBar classes)

* use plot.rect or plot.quad instead

Thanks,

Bryan

···

On Jan 30, 2018, at 14:36, [email protected] wrote:

Hello,

I am trying to generate a candlestick chart using BokehJS and have a problem with vbar glyph, more specifically, I get this error: "Uncaught TypeError: plot.vbar is not a function". It works fine with a segment glyph. Any help is highly appreciated.

var width = 12*15*1000;

var source = new Bokeh.ColumnDataSource({
    data: { x: [Math.random()], o: [Math.random()],
          h: [Math.random()], l: [Math.random()],
          c: [Math.random()], w: width}
});

var tools = "pan,crosshair,wheel_zoom,box_zoom,reset";

var plot = Bokeh.Plotting.figure({title:'Example of Random data',
          x_axis_type:'datetime',
          tools: tools, height: 300, width: 900});

var segment = plot.segment({field: "x"},
         {field: "h"},
         {field: "x"},
         {field: "l"},
         {source:source});

var vbar = plot.vbar({field: "x"},
         {field: "w"},
         {field: "o"},
         {field: "c"},
         {source:source});

Bokeh.Plotting.show(plot, document.getElementById('bk_plot'));

function getCandles(){
     $.ajax({
      type: "POST",
      url: "/get_data",
      contentType: 'application/json; charset=UTF-8',
       success: function(response){
           source.data.x = response.time;
       source.data.o = response.o;
       source.data.h = response.h;
       source.data.l = response.l;
       source.data.c = response.c;
       source.trigger('change')
      },
      error: function(error){
          console.log(error);
      }
    });
}

--
You received this message because you are subscribed to the Google Groups "Bokeh Discussion - Public" group.
To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].
To post to this group, send email to [email protected].
To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/ce995eac-b1bf-44d7-abaa-c5a426413bfe%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Bryan,

Thank you very much for your suggestion.

Best,

Vitali

···

On Tuesday, January 30, 2018 at 4:05:58 PM UTC-5, Bryan Van de ven wrote:

Hi,

It does not look as thought the BokehJS “plotting” API has been updated to add vbar/hbar yet. This should be a fairly simple thing to do, so I’d encourage you to open an issue on GitHub about it so that the work can be prioritized and tracked. In the mean, you can either:

  • use the lower level Models API (e.g. VBar and HBar classes)

  • use plot.rect or plot.quad instead

Thanks,

Bryan

On Jan 30, 2018, at 14:36, [email protected] wrote:

Hello,

I am trying to generate a candlestick chart using BokehJS and have a problem with vbar glyph, more specifically, I get this error: “Uncaught TypeError: plot.vbar is not a function”. It works fine with a segment glyph. Any help is highly appreciated.

var width = 12151000;

var source = new Bokeh.ColumnDataSource({

data: { x: [Math.random()], o: [Math.random()],
            h: [Math.random()], l: [Math.random()],
            c: [Math.random()], w: width}

});

var tools = “pan,crosshair,wheel_zoom,box_zoom,reset”;

var plot = Bokeh.Plotting.figure({title:‘Example of Random data’,

                              x_axis_type:'datetime',
                              tools: tools, height: 300, width: 900});

var segment = plot.segment({field: “x”},

                       {field: "h"},
                       {field: "x"},
                       {field: "l"},
                       {source:source});

var vbar = plot.vbar({field: “x”},

                 {field: "w"},
                 {field: "o"},
                 {field: "c"},
                 {source:source});

Bokeh.Plotting.show(plot, document.getElementById(‘bk_plot’));

function getCandles(){

 $.ajax({
        type: "POST",
        url: "/get_data",
        contentType: 'application/json; charset=UTF-8',
         success: function(response){
             source.data.x = response.time;
         source.data.o = response.o;
         source.data.h = response.h;
         source.data.l = response.l;
         source.data.c = response.c;
         source.trigger('change')
        },
        error: function(error){
            console.log(error);
        }
});

}


You received this message because you are subscribed to the Google Groups “Bokeh Discussion - Public” group.

To unsubscribe from this group and stop receiving emails from it, send an email to [email protected].

To post to this group, send email to [email protected].

To view this discussion on the web visit https://groups.google.com/a/continuum.io/d/msgid/bokeh/ce995eac-b1bf-44d7-abaa-c5a426413bfe%40continuum.io.

For more options, visit https://groups.google.com/a/continuum.io/d/optout.