autoload_static: "no matching script tag was found" and plotting multiple charts

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

  js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

  http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data

Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:

  https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

···

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.

--
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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

BTW I notice a comment on that docs link about things needing to be located under <head> which is certainly not true. I'm not sure where that warning came from. It might also be instructive to look at a working example, you can view the page source here to see autoload_static in actual use around like 190:

  http://bokeh.pydata.org/en/latest/docs/gallery/sinerror.html

Thanks,

Bryan

···

On Apr 18, 2016, at 12:06 AM, Bryan Van de Ven <[email protected]> wrote:

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

  js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

  http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data

Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:

  https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.

--
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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Note to self: the script from embed.components *does* need to be under <head> I think that warning is just in the wrong place in the docs.

Bryan

···

On Apr 18, 2016, at 12:10 AM, Bryan Van de Ven <[email protected]> wrote:

BTW I notice a comment on that docs link about things needing to be located under <head> which is certainly not true. I'm not sure where that warning came from. It might also be instructive to look at a working example, you can view the page source here to see autoload_static in actual use around like 190:

  http://bokeh.pydata.org/en/latest/docs/gallery/sinerror.html

Thanks,

Bryan

On Apr 18, 2016, at 12:06 AM, Bryan Van de Ven <[email protected]> wrote:

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

  js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

  http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data

Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:

  https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.

--
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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…

    f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {

    console.warn("failed to load library " + url);

  };

  console.log("Bokeh: injecting script tag for BokehJS library: ", url);

  document.getElementsByTagName("head")[0].appendChild(s);

}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);

if (element == null) {

console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")

return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

···

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.

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

I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can't "find itself". Can you try adding "defer" (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

···

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of "script" (equivalent to "js" in your case) at the script path:

with open(script_path,"w", 0) as f: # flush with no buffer, this doesn't change anything...
        f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

<script
src="static/js/bokeh.js"
id="bf084d45-9bb2-4cdd-8006-c5631799b3a2"
data-bokeh-model-id="e9863bb7-c53d-4117-be7f-ebfda669c507"
data-bokeh-doc-id="754b1825-85f9-4df4-9498-4d0b0335ed2d"
></script>

and the element ID in the script body that is saved to script_path:

      s.onerror = function() {
        console.warn("failed to load library " + url);
      };
      console.log("Bokeh: injecting script tag for BokehJS library: ", url);
      document.getElementsByTagName("head")[0].appendChild(s);
    }
  };var element = document.getElementById("bf084d45-9bb2-4cdd-8006-c5631799b3a2");
  if (element == null) {
    console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
    return false;

Again, what's strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That's why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

        js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

        http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data

Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:

        https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

> On Apr 17, 2016, at 2:58 PM, [email protected] wrote:
>
> I am trying to embed a bar chart in my Flask app:
>
> plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> script_path = os.path.join('static', 'js', 'bokeh.js')
> script, tag = autoload_static(plot, CDN, script_path)
>
> Usually this fails to load with the following browser error:
>
> Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.
>
> However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.
>
> Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:
>
> plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> script_path = os.path.join('static', 'js', 'bokeh.js')
> script, tag = autoload_static([plot, plot, plot], CDN, script_path)
>
> I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.
>
> --
> 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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout.

--
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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Bryan,

I tested on Safari, Firefox, and Chrome (with the “defer” tag) and the result was the same. That is, it errors out the first time with the “autoload.js” error and then it would show the plot if I reload with the DevTools “on”.

Is there a better or easier to do this instead of the autoload_static function?

Best,

Sean

···

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:

I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…

    f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

<script

src=“static/js/bokeh.js”

id=“bf084d45-9bb2-4cdd-8006-c5631799b3a2”

data-bokeh-model-id=“e9863bb7-c53d-4117-be7f-ebfda669c507”

data-bokeh-doc-id=“754b1825-85f9-4df4-9498-4d0b0335ed2d”

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);

if (element == null) {

console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.

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

I was chatting with another colleague of mine. I wonder if the problem comes up because I’m using Flask and somehow the JS is being called before the page/DOM is fully loaded? I’m not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does “We write the JS so you don’t have to” still apply here? :slight_smile:

I’ll try to dig a little while I wait.

Best,

Sean

···

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:

I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…

    f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

<script

src=“static/js/bokeh.js”

id=“bf084d45-9bb2-4cdd-8006-c5631799b3a2”

data-bokeh-model-id=“e9863bb7-c53d-4117-be7f-ebfda669c507”

data-bokeh-doc-id=“754b1825-85f9-4df4-9498-4d0b0335ed2d”

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);

if (element == null) {

console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:

Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.

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

Sean,

I actually expect that is exactly the problem, and something that "defer" might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an "onload" callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

···

On Apr 18, 2016, at 1:33 PM, [email protected] wrote:

I was chatting with another colleague of mine. I wonder if the problem comes up because I'm using Flask and somehow the JS is being called before the page/DOM is fully loaded? I'm not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does "We write the JS so you don't have to" still apply here? :slight_smile:

I'll try to dig a little while I wait.

Best,
Sean

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can't "find itself". Can you try adding "defer" (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

> On Apr 18, 2016, at 10:16 AM, [email protected] wrote:
>
> Bryan,
>
> Yep, I am saving the contents of "script" (equivalent to "js" in your case) at the script path:
>
> with open(script_path,"w", 0) as f: # flush with no buffer, this doesn't change anything...
> f.write(script)
>
> And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:
>
> <script
> src="static/js/bokeh.js"
> id="bf084d45-9bb2-4cdd-8006-c5631799b3a2"
> data-bokeh-model-id="e9863bb7-c53d-4117-be7f-ebfda669c507"
> data-bokeh-doc-id="754b1825-85f9-4df4-9498-4d0b0335ed2d"
> ></script>
>
> and the element ID in the script body that is saved to script_path:
>
> s.onerror = function() {
> console.warn("failed to load library " + url);
> };
> console.log("Bokeh: injecting script tag for BokehJS library: ", url);
> document.getElementsByTagName("head")[0].appendChild(s);
> }
> };var element = document.getElementById("bf084d45-9bb2-4cdd-8006-c5631799b3a2");
> if (element == null) {
> console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
> return false;
>
>
> Again, what's strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That's why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.
>
> Let me know if you need anything else.
>
> On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
> Hi Sean,
>
> Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:
>
> js, tag = autoload_static(plot, CDN, "some/path/foo.js")
>
> as described here:
>
> http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data
>
> Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.
>
> Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:
>
> https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76
>
> As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.
>
> In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.
>
> Thanks,
>
> Bryan
>
>
> > On Apr 17, 2016, at 2:58 PM, [email protected] wrote:
> >
> > I am trying to embed a bar chart in my Flask app:
> >
> > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > script_path = os.path.join('static', 'js', 'bokeh.js')
> > script, tag = autoload_static(plot, CDN, script_path)
> >
> > Usually this fails to load with the following browser error:
> >
> > Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.
> >
> > However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.
> >
> > Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:
> >
> > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > script_path = os.path.join('static', 'js', 'bokeh.js')
> > script, tag = autoload_static([plot, plot, plot], CDN, script_path)
> >
> > I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.
> >
> > --
> > 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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
> > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
>
>
> --
> 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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout.

--
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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Yes, I would appreciate it if you could look at this for me. In the meantime, I’ve created a GH issue here:

Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject…

Best,

Sean

···

On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:

Sean,

I actually expect that is exactly the problem, and something that “defer” might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an “onload” callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

On Apr 18, 2016, at 1:33 PM, [email protected] wrote:

I was chatting with another colleague of mine. I wonder if the problem comes up because I’m using Flask and somehow the JS is being called before the page/DOM is fully loaded? I’m not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does “We write the JS so you don’t have to” still apply here? :slight_smile:

I’ll try to dig a little while I wait.

Best,

Sean

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:

I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…
f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);
if (element == null) {
console.log("Bokeh: ERROR: autoload.js configured with elementid ‘bf084d45-9bb2-4cdd-8006-c5631799b3a2’ but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.

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

Sean,

Great, we will take a look very soon.

I don't think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.

Thanks,

···

On Apr 18, 2016, at 2:43 PM, [email protected] wrote:

Yes, I would appreciate it if you could look at this for me. In the meantime, I've created a GH issue here:

https://github.com/bokeh/bokeh/issues/4188

Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject...

Best,
Sean

On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:
Sean,

I actually expect that is exactly the problem, and something that "defer" might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an "onload" callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

> On Apr 18, 2016, at 1:33 PM, [email protected] wrote:
>
> I was chatting with another colleague of mine. I wonder if the problem comes up because I'm using Flask and somehow the JS is being called before the page/DOM is fully loaded? I'm not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does "We write the JS so you don't have to" still apply here? :slight_smile:
>
> I'll try to dig a little while I wait.
>
> Best,
> Sean
>
> On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
> I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can't "find itself". Can you try adding "defer" (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html
>
> If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.
>
> Thanks,
>
> Bryan
>
>
>
> > On Apr 18, 2016, at 10:16 AM, [email protected] wrote:
> >
> > Bryan,
> >
> > Yep, I am saving the contents of "script" (equivalent to "js" in your case) at the script path:
> >
> > with open(script_path,"w", 0) as f: # flush with no buffer, this doesn't change anything...
> > f.write(script)
> >
> > And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:
> >
> > <script
> > src="static/js/bokeh.js"
> > id="bf084d45-9bb2-4cdd-8006-c5631799b3a2"
> > data-bokeh-model-id="e9863bb7-c53d-4117-be7f-ebfda669c507"
> > data-bokeh-doc-id="754b1825-85f9-4df4-9498-4d0b0335ed2d"
> > ></script>
> >
> > and the element ID in the script body that is saved to script_path:
> >
> > s.onerror = function() {
> > console.warn("failed to load library " + url);
> > };
> > console.log("Bokeh: injecting script tag for BokehJS library: ", url);
> > document.getElementsByTagName("head")[0].appendChild(s);
> > }
> > };var element = document.getElementById("bf084d45-9bb2-4cdd-8006-c5631799b3a2");
> > if (element == null) {
> > console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
> > return false;
> >
> >
> > Again, what's strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That's why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.
> >
> > Let me know if you need anything else.
> >
> > On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
> > Hi Sean,
> >
> > Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:
> >
> > js, tag = autoload_static(plot, CDN, "some/path/foo.js")
> >
> > as described here:
> >
> > http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data
> >
> > Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.
> >
> > Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:
> >
> > https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76
> >
> > As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.
> >
> > In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.
> >
> > Thanks,
> >
> > Bryan
> >
> >
> > > On Apr 17, 2016, at 2:58 PM, [email protected] wrote:
> > >
> > > I am trying to embed a bar chart in my Flask app:
> > >
> > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > script, tag = autoload_static(plot, CDN, script_path)
> > >
> > > Usually this fails to load with the following browser error:
> > >
> > > Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.
> > >
> > > However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.
> > >
> > > Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:
> > >
> > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > script, tag = autoload_static([plot, plot, plot], CDN, script_path)
> > >
> > > I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.
> > >
> > > --
> > > 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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
> > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> >
> >
> > --
> > 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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
> > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
>
>
> --
> 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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout.

--
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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Okay, I think I solved the problem related to the autoload.js error. As suggested, I should wrap by simply doing this:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static(plot, CDN, script_path)

script = script.replace("(function(global)", “window.onload = (function(global)”)

Essentially, I’m just prepending "window.onload = " to the javascript. I’ll have to make sure and double check that I’m not somehow caching the page and hence why it works. Will confirm this in the afternoon.

Regarding multiple plots, yes, I guess I just assumed that since component accepts multiple plots that autoload_static should too. But you’re right, the docs clearly say “plot_object” (singular). So, I will just use a grid/vplot instead or, as you suggested, call autoload_static() multiple times (the former is probably better).

Best,

Sean

···

On Monday, April 18, 2016 at 3:49:10 PM UTC-4, Bryan Van de ven wrote:

Sean,

Great, we will take a look very soon.

I don’t think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.

Thanks,

On Apr 18, 2016, at 2:43 PM, [email protected] wrote:

Yes, I would appreciate it if you could look at this for me. In the meantime, I’ve created a GH issue here:

https://github.com/bokeh/bokeh/issues/4188

Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject…

Best,

Sean

On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:

Sean,

I actually expect that is exactly the problem, and something that “defer” might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an “onload” callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

On Apr 18, 2016, at 1:33 PM, [email protected] wrote:

I was chatting with another colleague of mine. I wonder if the problem comes up because I’m using Flask and somehow the JS is being called before the page/DOM is fully loaded? I’m not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does “We write the JS so you don’t have to” still apply here? :slight_smile:

I’ll try to dig a little while I wait.

Best,
Sean

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…
f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);
if (element == null) {
console.log("Bokeh: ERROR: autoload.js configured with elementid ‘bf084d45-9bb2-4cdd-8006-c5631799b3a2’ but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.

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

Sean, thanks for doing all this leg work! I think we will definitely want to work up a PR around this before 0.12 is released.

Bryan

···

On Apr 18, 2016, at 3:14 PM, [email protected] wrote:

Okay, I think I solved the problem related to the autoload.js error. As suggested, I should wrap by simply doing this:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join('static', 'js', 'bokeh.js')
script, tag = autoload_static(plot, CDN, script_path)
script = script.replace("(function(global)", "window.onload = (function(global)")

Essentially, I'm just prepending "window.onload = " to the javascript. I'll have to make sure and double check that I'm not somehow caching the page and hence why it works. Will confirm this in the afternoon.

Regarding multiple plots, yes, I guess I just assumed that since component accepts multiple plots that autoload_static should too. But you're right, the docs clearly say "plot_object" (singular). So, I will just use a grid/vplot instead or, as you suggested, call autoload_static() multiple times (the former is probably better).

Best,
Sean

On Monday, April 18, 2016 at 3:49:10 PM UTC-4, Bryan Van de ven wrote:
Sean,

Great, we will take a look very soon.

I don't think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.

Thanks,

> On Apr 18, 2016, at 2:43 PM, [email protected] wrote:
>
> Yes, I would appreciate it if you could look at this for me. In the meantime, I've created a GH issue here:
>
> https://github.com/bokeh/bokeh/issues/4188
>
> Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject...
>
> Best,
> Sean
>
> On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:
> Sean,
>
> I actually expect that is exactly the problem, and something that "defer" might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an "onload" callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?
>
> Thanks,
>
> Bryan
>
>
> > On Apr 18, 2016, at 1:33 PM, [email protected] wrote:
> >
> > I was chatting with another colleague of mine. I wonder if the problem comes up because I'm using Flask and somehow the JS is being called before the page/DOM is fully loaded? I'm not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does "We write the JS so you don't have to" still apply here? :slight_smile:
> >
> > I'll try to dig a little while I wait.
> >
> > Best,
> > Sean
> >
> > On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
> > I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can't "find itself". Can you try adding "defer" (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html
> >
> > If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.
> >
> > Thanks,
> >
> > Bryan
> >
> >
> >
> > > On Apr 18, 2016, at 10:16 AM, [email protected] wrote:
> > >
> > > Bryan,
> > >
> > > Yep, I am saving the contents of "script" (equivalent to "js" in your case) at the script path:
> > >
> > > with open(script_path,"w", 0) as f: # flush with no buffer, this doesn't change anything...
> > > f.write(script)
> > >
> > > And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:
> > >
> > > <script
> > > src="static/js/bokeh.js"
> > > id="bf084d45-9bb2-4cdd-8006-c5631799b3a2"
> > > data-bokeh-model-id="e9863bb7-c53d-4117-be7f-ebfda669c507"
> > > data-bokeh-doc-id="754b1825-85f9-4df4-9498-4d0b0335ed2d"
> > > ></script>
> > >
> > > and the element ID in the script body that is saved to script_path:
> > >
> > > s.onerror = function() {
> > > console.warn("failed to load library " + url);
> > > };
> > > console.log("Bokeh: injecting script tag for BokehJS library: ", url);
> > > document.getElementsByTagName("head")[0].appendChild(s);
> > > }
> > > };var element = document.getElementById("bf084d45-9bb2-4cdd-8006-c5631799b3a2");
> > > if (element == null) {
> > > console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
> > > return false;
> > >
> > >
> > > Again, what's strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That's why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.
> > >
> > > Let me know if you need anything else.
> > >
> > > On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
> > > Hi Sean,
> > >
> > > Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:
> > >
> > > js, tag = autoload_static(plot, CDN, "some/path/foo.js")
> > >
> > > as described here:
> > >
> > > http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data
> > >
> > > Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.
> > >
> > > Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:
> > >
> > > https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76
> > >
> > > As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.
> > >
> > > In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.
> > >
> > > Thanks,
> > >
> > > Bryan
> > >
> > >
> > > > On Apr 17, 2016, at 2:58 PM, [email protected] wrote:
> > > >
> > > > I am trying to embed a bar chart in my Flask app:
> > > >
> > > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > > script, tag = autoload_static(plot, CDN, script_path)
> > > >
> > > > Usually this fails to load with the following browser error:
> > > >
> > > > Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.
> > > >
> > > > However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.
> > > >
> > > > Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:
> > > >
> > > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > > script, tag = autoload_static([plot, plot, plot], CDN, script_path)
> > > >
> > > > I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.
> > > >
> > > > --
> > > > 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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
> > > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> > >
> > >
> > > --
> > > 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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
> > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> >
> >
> > --
> > 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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
> > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
>
>
> --
> 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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout.

--
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/3daf973d-9db4-44b4-b5ee-374d18fd3190%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Bryan,

I would be happy to work on it if you’ll guide me through it (really my first time doing a GH PR, let alone trying to understand how to follow merges and such for posted issues). Not sure if my solution is generally applicable or if there should be an additional argument that one could pass to autoload_static() (i.e., “defer=True”) which prepends "window.onload = " to the script.

Let me know how or what I need to do to contribute (i.e., RTFM?). Would love my first PR to be for bokeh!

Best,

Sean

···

On Monday, April 18, 2016 at 4:16:56 PM UTC-4, Bryan Van de ven wrote:

Sean, thanks for doing all this leg work! I think we will definitely want to work up a PR around this before 0.12 is released.

Bryan

On Apr 18, 2016, at 3:14 PM, [email protected] wrote:

Okay, I think I solved the problem related to the autoload.js error. As suggested, I should wrap by simply doing this:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)

script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)

script, tag = autoload_static(plot, CDN, script_path)

script = script.replace("(function(global)", “window.onload = (function(global)”)

Essentially, I’m just prepending "window.onload = " to the javascript. I’ll have to make sure and double check that I’m not somehow caching the page and hence why it works. Will confirm this in the afternoon.

Regarding multiple plots, yes, I guess I just assumed that since component accepts multiple plots that autoload_static should too. But you’re right, the docs clearly say “plot_object” (singular). So, I will just use a grid/vplot instead or, as you suggested, call autoload_static() multiple times (the former is probably better).

Best,

Sean

On Monday, April 18, 2016 at 3:49:10 PM UTC-4, Bryan Van de ven wrote:

Sean,

Great, we will take a look very soon.

I don’t think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.

Thanks,

On Apr 18, 2016, at 2:43 PM, [email protected] wrote:

Yes, I would appreciate it if you could look at this for me. In the meantime, I’ve created a GH issue here:

https://github.com/bokeh/bokeh/issues/4188

Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject…

Best,
Sean

On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:
Sean,

I actually expect that is exactly the problem, and something that “defer” might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an “onload” callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

On Apr 18, 2016, at 1:33 PM, [email protected] wrote:

I was chatting with another colleague of mine. I wonder if the problem comes up because I’m using Flask and somehow the JS is being called before the page/DOM is fully loaded? I’m not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does “We write the JS so you don’t have to” still apply here? :slight_smile:

I’ll try to dig a little while I wait.

Best,
Sean

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…
f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);
if (element == null) {
console.log("Bokeh: ERROR: autoload.js configured with elementid ‘bf084d45-9bb2-4cdd-8006-c5631799b3a2’ but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/3daf973d-9db4-44b4-b5ee-374d18fd3190%40continuum.io.

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

Sean,

That would be great! I think we could start with a PR that implements the onload solution universally, and call in a few other folks to review/discuss. In terms of the mechanics of a PR, the high level steps are:

  * fork the bokeh repo on GitHub
  * clone a copy of your fork to your computer
  * make a branch, something like: "git checkout -b sean/4188_autoload_static_onload"
  * make changes on the branch you checked out
  * commit and push the changes back to GitHub ("git push" then follow the instructions)
  * press the big "Compare and Pull Request" button on GH

This tutorial seems to flesh out more detail on those steps:

  http://hisham.hm/2016/01/01/how-to-make-a-pull-request-on-github-a-quick-tutorial/

But definitely let me know if there are questions I can answer!

Thanks,

Bryan

···

On Apr 18, 2016, at 6:14 PM, [email protected] wrote:

Bryan,

I would be happy to work on it if you'll guide me through it (really my first time doing a GH PR, let alone trying to understand how to follow merges and such for posted issues). Not sure if my solution is generally applicable or if there should be an additional argument that one could pass to autoload_static() (i.e., "defer=True") which prepends "window.onload = " to the script.

Let me know how or what I need to do to contribute (i.e., RTFM?). Would love my first PR to be for bokeh!

Best,
Sean

On Monday, April 18, 2016 at 4:16:56 PM UTC-4, Bryan Van de ven wrote:
Sean, thanks for doing all this leg work! I think we will definitely want to work up a PR around this before 0.12 is released.

Bryan

> On Apr 18, 2016, at 3:14 PM, [email protected] wrote:
>
> Okay, I think I solved the problem related to the autoload.js error. As suggested, I should wrap by simply doing this:
>
> plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> script_path = os.path.join('static', 'js', 'bokeh.js')
> script, tag = autoload_static(plot, CDN, script_path)
> script = script.replace("(function(global)", "window.onload = (function(global)")
>
> Essentially, I'm just prepending "window.onload = " to the javascript. I'll have to make sure and double check that I'm not somehow caching the page and hence why it works. Will confirm this in the afternoon.
>
> Regarding multiple plots, yes, I guess I just assumed that since component accepts multiple plots that autoload_static should too. But you're right, the docs clearly say "plot_object" (singular). So, I will just use a grid/vplot instead or, as you suggested, call autoload_static() multiple times (the former is probably better).
>
> Best,
> Sean
>
> On Monday, April 18, 2016 at 3:49:10 PM UTC-4, Bryan Van de ven wrote:
> Sean,
>
> Great, we will take a look very soon.
>
> I don't think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.
>
> Thanks,
>
>
>
> > On Apr 18, 2016, at 2:43 PM, [email protected] wrote:
> >
> > Yes, I would appreciate it if you could look at this for me. In the meantime, I've created a GH issue here:
> >
> > https://github.com/bokeh/bokeh/issues/4188
> >
> > Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject...
> >
> > Best,
> > Sean
> >
> > On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:
> > Sean,
> >
> > I actually expect that is exactly the problem, and something that "defer" might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an "onload" callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?
> >
> > Thanks,
> >
> > Bryan
> >
> >
> > > On Apr 18, 2016, at 1:33 PM, [email protected] wrote:
> > >
> > > I was chatting with another colleague of mine. I wonder if the problem comes up because I'm using Flask and somehow the JS is being called before the page/DOM is fully loaded? I'm not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does "We write the JS so you don't have to" still apply here? :slight_smile:
> > >
> > > I'll try to dig a little while I wait.
> > >
> > > Best,
> > > Sean
> > >
> > > On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
> > > I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can't "find itself". Can you try adding "defer" (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html
> > >
> > > If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.
> > >
> > > Thanks,
> > >
> > > Bryan
> > >
> > >
> > >
> > > > On Apr 18, 2016, at 10:16 AM, [email protected]m wrote:
> > > >
> > > > Bryan,
> > > >
> > > > Yep, I am saving the contents of "script" (equivalent to "js" in your case) at the script path:
> > > >
> > > > with open(script_path,"w", 0) as f: # flush with no buffer, this doesn't change anything...
> > > > f.write(script)
> > > >
> > > > And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:
> > > >
> > > > <script
> > > > src="static/js/bokeh.js"
> > > > id="bf084d45-9bb2-4cdd-8006-c5631799b3a2"
> > > > data-bokeh-model-id="e9863bb7-c53d-4117-be7f-ebfda669c507"
> > > > data-bokeh-doc-id="754b1825-85f9-4df4-9498-4d0b0335ed2d"
> > > > ></script>
> > > >
> > > > and the element ID in the script body that is saved to script_path:
> > > >
> > > > s.onerror = function() {
> > > > console.warn("failed to load library " + url);
> > > > };
> > > > console.log("Bokeh: injecting script tag for BokehJS library: ", url);
> > > > document.getElementsByTagName("head")[0].appendChild(s);
> > > > }
> > > > };var element = document.getElementById("bf084d45-9bb2-4cdd-8006-c5631799b3a2");
> > > > if (element == null) {
> > > > console.log("Bokeh: ERROR: autoload.js configured with elementid 'bf084d45-9bb2-4cdd-8006-c5631799b3a2' but no matching script tag was found. ")
> > > > return false;
> > > >
> > > >
> > > > Again, what's strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That's why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.
> > > >
> > > > Let me know if you need anything else.
> > > >
> > > > On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
> > > > Hi Sean,
> > > >
> > > > Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:
> > > >
> > > > js, tag = autoload_static(plot, CDN, "some/path/foo.js")
> > > >
> > > > as described here:
> > > >
> > > > http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data
> > > >
> > > > Under that naming, "js" is code you need to save at your "script_path" and "tag" is an HTML script tag that will load that .js file.
> > > >
> > > > Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to "script_path"? It is located in the JS roughly here:
> > > >
> > > > https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76
> > > >
> > > > As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.
> > > >
> > > > In one sense I don't think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.
> > > >
> > > > Thanks,
> > > >
> > > > Bryan
> > > >
> > > >
> > > > > On Apr 17, 2016, at 2:58 PM, [email protected] wrote:
> > > > >
> > > > > I am trying to embed a bar chart in my Flask app:
> > > > >
> > > > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > > > script, tag = autoload_static(plot, CDN, script_path)
> > > > >
> > > > > Usually this fails to load with the following browser error:
> > > > >
> > > > > Bokeh: ERROR: autoload.js configured with elementid 'b5def586-251a-4c29-8a89-7efddc0d211a' but no matching script tag was found.
> > > > >
> > > > > However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don't make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.
> > > > >
> > > > > Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, "models") but I can't seem to get this to work:
> > > > >
> > > > > plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
> > > > > script_path = os.path.join('static', 'js', 'bokeh.js')
> > > > > script, tag = autoload_static([plot, plot, plot], CDN, script_path)
> > > > >
> > > > > I want to plot multiple bar plots (ultimately, with different data) but I don't have enough information to get the syntax right.
> > > > >
> > > > > --
> > > > > 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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
> > > > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> > > >
> > > >
> > > > --
> > > > 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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
> > > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> > >
> > >
> > > --
> > > 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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
> > > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
> >
> >
> > --
> > 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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.
> > For more options, visit https://groups.google.com/a/continuum.io/d/optout.
>
>
> --
> 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/3daf973d-9db4-44b4-b5ee-374d18fd3190%40continuum.io.
> For more options, visit https://groups.google.com/a/continuum.io/d/optout.

--
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/2e64610e-f10d-4aac-aeb6-f70a67383367%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.

Done. Found some time this morning. Please take a look:

Force JS execution after page/DOM fully loads #4189

Let me know if anything else is needed or if that’s sufficient.

Best,

Sean

···

On Monday, April 18, 2016 at 10:23:09 PM UTC-4, Bryan Van de ven wrote:

Sean,

That would be great! I think we could start with a PR that implements the onload solution universally, and call in a few other folks to review/discuss. In terms of the mechanics of a PR, the high level steps are:

    * fork the bokeh repo on GitHub

    * clone a copy of your fork to your computer

    * make a branch, something like: "git checkout -b sean/4188_autoload_static_onload"

    * make changes on the branch you checked out

    * commit and push the changes back to GitHub ("git push" then follow the instructions)

    * press the big "Compare and Pull Request" button on GH

This tutorial seems to flesh out more detail on those steps:

    [http://hisham.hm/2016/01/01/how-to-make-a-pull-request-on-github-a-quick-tutorial/](http://hisham.hm/2016/01/01/how-to-make-a-pull-request-on-github-a-quick-tutorial/)

But definitely let me know if there are questions I can answer!

Thanks,

Bryan

On Apr 18, 2016, at 6:14 PM, [email protected] wrote:

Bryan,

I would be happy to work on it if you’ll guide me through it (really my first time doing a GH PR, let alone trying to understand how to follow merges and such for posted issues). Not sure if my solution is generally applicable or if there should be an additional argument that one could pass to autoload_static() (i.e., “defer=True”) which prepends "window.onload = " to the script.

Let me know how or what I need to do to contribute (i.e., RTFM?). Would love my first PR to be for bokeh!

Best,

Sean

On Monday, April 18, 2016 at 4:16:56 PM UTC-4, Bryan Van de ven wrote:

Sean, thanks for doing all this leg work! I think we will definitely want to work up a PR around this before 0.12 is released.

Bryan

On Apr 18, 2016, at 3:14 PM, [email protected] wrote:

Okay, I think I solved the problem related to the autoload.js error. As suggested, I should wrap by simply doing this:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)
script = script.replace("(function(global)", “window.onload = (function(global)”)

Essentially, I’m just prepending "window.onload = " to the javascript. I’ll have to make sure and double check that I’m not somehow caching the page and hence why it works. Will confirm this in the afternoon.

Regarding multiple plots, yes, I guess I just assumed that since component accepts multiple plots that autoload_static should too. But you’re right, the docs clearly say “plot_object” (singular). So, I will just use a grid/vplot instead or, as you suggested, call autoload_static() multiple times (the former is probably better).

Best,
Sean

On Monday, April 18, 2016 at 3:49:10 PM UTC-4, Bryan Van de ven wrote:
Sean,

Great, we will take a look very soon.

I don’t think you can supply multiple models to one autoload_static call. You could supply a layout (e.g. vbox, etc.) that has multiple things in it. Otherwise you would call autoload_static for each thing that you wanted to embed separately. I know bokeh.embed.components does support passing multiple models, is that perhaps what you are thinking of? Otherwise, if it is suggested in the docs for autoload_static, please point me in that direction so I can evaluate them.

Thanks,

On Apr 18, 2016, at 2:43 PM, [email protected] wrote:

Yes, I would appreciate it if you could look at this for me. In the meantime, I’ve created a GH issue here:

https://github.com/bokeh/bokeh/issues/4188

Additionally, (this was in the original question) how do I do multiple plots with autoload? I tried supplying a list of plots but it complains that the list is not a PlotObject…

Best,
Sean

On Monday, April 18, 2016 at 2:40:58 PM UTC-4, Bryan Van de ven wrote:
Sean,

I actually expect that is exactly the problem, and something that “defer” might help with. But it might also be simpler for us to jsut wrap all the actual code that does in an “onload” callback or something in the script. It would be pretty simple to get you some code to try that, but I do have to prepare a talk for tomorrow, so it would be in a day or two probably. Inthe meantime, can you make an issue on GH to track this issue, linking this mailing list discussion?

Thanks,

Bryan

On Apr 18, 2016, at 1:33 PM, [email protected] wrote:

I was chatting with another colleague of mine. I wonder if the problem comes up because I’m using Flask and somehow the JS is being called before the page/DOM is fully loaded? I’m not a JS guy but it was suggested to me that maybe I could modify the JS script to wait until the page is fully loaded first before allowing the JS to execute? Not sure how to do that or check if that is the problem. Does “We write the JS so you don’t have to” still apply here? :slight_smile:

I’ll try to dig a little while I wait.

Best,
Sean

On Monday, April 18, 2016 at 11:43:57 AM UTC-4, Bryan Van de ven wrote:
I wonder if the script is being executed asynchronously in this version of Chrome. That would possibly explain why the script tag can’t “find itself”. Can you try adding “defer” (http://www.w3schools.com/tags/att_script_defer.asp) to the script tag, and see if that resolves the problem? It might also be helpful to see if things work as-is in other browsers, or if your version of chrome has he same issue with any of the standalone (non-server) plots at http://bokeh.pydata.org/en/latest/docs/gallery.html

If this is the issue, we may have to re-visit the fundamental assumptions of autoload_static, possibly deprecating it in favor of something similar but that is implemented differently.

Thanks,

Bryan

On Apr 18, 2016, at 10:16 AM, [email protected] wrote:

Bryan,

Yep, I am saving the contents of “script” (equivalent to “js” in your case) at the script path:

with open(script_path,“w”, 0) as f: # flush with no buffer, this doesn’t change anything…
f.write(script)

And yes, the ID attribute (dynamically included into the body of the html page) is confirmed to be the same in the script tag:

and the element ID in the script body that is saved to script_path:

  s.onerror = function() {
    console.warn("failed to load library " + url);
  };
  console.log("Bokeh: injecting script tag for BokehJS library: ", url);
  document.getElementsByTagName("head")[0].appendChild(s);
}

};var element = document.getElementById(“bf084d45-9bb2-4cdd-8006-c5631799b3a2”);
if (element == null) {
console.log("Bokeh: ERROR: autoload.js configured with elementid ‘bf084d45-9bb2-4cdd-8006-c5631799b3a2’ but no matching script tag was found. ")
return false;

Again, what’s strange is that the plot shows and the error is avoided when I simply reload the page in Chrome DevTools mode. That’s why I tried to flush the text that is written to the script_path in case there was a potential race condition. Still no luck.

Let me know if you need anything else.

On Monday, April 18, 2016 at 1:06:58 AM UTC-4, Bryan Van de ven wrote:
Hi Sean,

Can you provide more information about how you are using the return values? FYI I am used to seeing the return values named more like:

    js, tag = autoload_static(plot, CDN, "some/path/foo.js")

as described here:

    [http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data](http://bokeh.pydata.org/en/latest/docs/user_guide/embed.html#static-data)

Under that naming, “js” is code you need to save at your “script_path” and “tag” is an HTML script tag that will load that .js file.

Does the element ID attribute of the script tag match the element id that is in the actual script body that you save to “script_path”? It is located in the JS roughly here:

    [https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76](https://github.com/bokeh/bokeh/blob/056433ebcdf5cde778241d2bb135301b801357c9/bokeh/core/_templates/autoload_js.js#L76)

As you can see there also, that error is what is reported if the code tries to locate itself (using the matching elementid), but fails.

In one sense I don’t think autoload_static gets alot of use, on the other hand, the entire docs site gallery is built off of it, so it does get exercised continuously, so hopefully we can get to the root of your issue quickly.

Thanks,

Bryan

On Apr 17, 2016, at 2:58 PM, [email protected] wrote:

I am trying to embed a bar chart in my Flask app:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static(plot, CDN, script_path)

Usually this fails to load with the following browser error:

Bokeh: ERROR: autoload.js configured with elementid ‘b5def586-251a-4c29-8a89-7efddc0d211a’ but no matching script tag was found.

However, if I turn on developer tools in Chrome and reload the page, then the bokeh chart loads up without a problem. Note that I don’t make changes to the code at all - only turn on DevTools and reload. Simply reloading the page does not cause the bokeh chart to load.

Secondly, the docs seem to imply that autoload_static() can take a list of plots (well, “models”) but I can’t seem to get this to work:

plot = Bar(df, label=CatAttr(columns=, sort=False), values=y, title=title)
script_path = os.path.join(‘static’, ‘js’, ‘bokeh.js’)
script, tag = autoload_static([plot, plot, plot], CDN, script_path)

I want to plot multiple bar plots (ultimately, with different data) but I don’t have enough information to get the syntax right.


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/2ddddca9-15ba-4879-88aa-9204cb11340a%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1e4b9211-01a5-4df8-a1de-93103237280c%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/896d4c30-c45c-4ccc-86ce-57d5671ff953%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/1efd0474-5538-4b92-bf00-b75aef1bf8c8%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/3daf973d-9db4-44b4-b5ee-374d18fd3190%40continuum.io.
For more options, visit https://groups.google.com/a/continuum.io/d/optout.


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/2e64610e-f10d-4aac-aeb6-f70a67383367%40continuum.io.

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