Geo data and maps in Bokehjs

Community Support
1

Hi,

I’m wondering if and how I can plot maps and geo data in Bokehjs. I currently have this type of setup but I’m getting an error worldMap.add_tile is not a function:


 var mapXrange = new Bokeh.Range1d({ start: -2000000, end: 2000000 });
 var mapYrange = new Bokeh.Range1d({ start: 1000000, end: 7000000 });

 var worldMap = Bokeh.Plotting.figure({
        tools: "pan,crosshair,wheel_zoom,box_zoom,reset,save",    
        height: 890,
        width: 460,     
        x_axis_type: "mercator",
        y_axis_type: "mercator",
        sizing_mode: "scale_width",
        x_range: mapXrange,
        y_range: mapYrange    
        }); // end of bokeh plot definition
      
    worldMap.add_tile("CartoDB Positron");
    Bokeh.Plotting.show(worldMap,'div#map');

Thanks for any help!

2

@SKr BokehJS exactly matches the “python side” of things 1-1 for the low level models API. But the higher level plotting API is less developed on the BokehJS side of things vs the Python side. AFAIK the add_tile method on figures has not been added to BokehJS. Please feel free to open a GitHub Issue to request it as a new feature.

In the mean time, you can refer to this BokehJS test to see how to add a tile renderer using the models API:

bokeh/bokehjs/test/integration/tiles.ts at branch-3.7 · bokeh/bokeh · GitHub

3

Thank you! I’ll look at the models API you suggested!