Visualization pixi render not working with chrome
DrCoolzic opened this issue · 19 comments
I installed the panel, but I only see the header containing "ZOOM TO FIT", "AUTO LAYOUT" and "UNLOCK ALL". But there is no content.
OS: Windows 10 version 2004 (19041.685) - 64 bit
Browsers tested: Chrome / Edge / Opera
With plugin_render type pixi : no content other than 3 commands on top
With plugin_render type three : Display works
see https://community.home-assistant.io/t/zigzag-panel-showing-no-graph/263918
Here is the console content
Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-data-zha.esm.js.
zigzag-wc.esm.js:6872 Zigzag [plugin] ✅ loaded /local/zigzag/plugins/plugin-data-zha.esm.js.
zigzag-wc.esm.js:6869 Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-layout-d3.esm.js.
zigzag-wc.esm.js:6872 Zigzag [plugin] ✅ loaded /local/zigzag/plugins/plugin-layout-d3.esm.js.
zigzag-wc.esm.js:6869 Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-render-pixi.esm.js.
zigzag-wc.esm.js:6866 Zigzag [plugin] ‼ unable to load plugin /local/zigzag/plugins/plugin-render-pixi.esm.js due to Error: WebGL unsupported in this browser, use "pixi.js-legacy" for fallback canvas2d support..
core.es.js:9796 Uncaught (in promise) Error: WebGL unsupported in this browser, use "pixi.js-legacy" for fallback canvas2d support.
at Function.Renderer.create (core.es.js:9796)
at autoDetectRenderer (core.es.js:9969)
at new RenderPlugin (zigzag-render.esm.js:6272)
at Module.createPlugin (zigzag-render.esm.js:6606)
at zigzag-wc.esm.js:9554
Also tested with Edge browser
seems to be the same problem?
Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-data-zha.esm.js.
zigzag-wc.esm.js:6872 Zigzag [plugin] ✅ loaded /local/zigzag/plugins/plugin-data-zha.esm.js.
zigzag-wc.esm.js:6869 Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-layout-d3.esm.js.
zigzag-wc.esm.js:6872 Zigzag [plugin] ✅ loaded /local/zigzag/plugins/plugin-layout-d3.esm.js.
zigzag-wc.esm.js:6869 Zigzag [plugin] ℹ Looking for /local/zigzag/plugins/plugin-render-pixi.esm.js.
zigzag-wc.esm.js:6866 Zigzag [plugin] ‼ unable to load plugin /local/zigzag/plugins/plugin-render-pixi.esm.js due to Error: WebGL unsupported in this browser, use "pixi.js-legacy" for fallback canvas2d support..
core.es.js:9796 Uncaught (in promise) Error: WebGL unsupported in this browser, use "pixi.js-legacy" for fallback canvas2d support.
at Function.Renderer.create (core.es.js:9796)
at autoDetectRenderer (core.es.js:9969)
at new RenderPlugin (zigzag-render.esm.js:6272)
at Module.createPlugin (zigzag-render.esm.js:6606)
at zigzag-wc.esm.js:9554
Renderer.create @ core.es.js:9796
autoDetectRenderer @ core.es.js:9969
RenderPlugin @ zigzag-render.esm.js:6272
createPlugin @ zigzag-render.esm.js:6606
(anonymous) @ zigzag-wc.esm.js:9554
async function (async)
firstUpdated @ zigzag-wc.esm.js:11068
firstUpdated @ zigzag-panel.ts:38
async function (async)
firstUpdated @ zigzag-panel.ts:13
performUpdate @ zigzag-wc.esm.js:2168
_enqueueUpdate @ zigzag-wc.esm.js:2104
async function (async)
_enqueueUpdate @ zigzag-wc.esm.js:2098
requestUpdateInternal @ zigzag-wc.esm.js:2070
initialize @ zigzag-wc.esm.js:1922
initialize @ zigzag-wc.esm.js:2629
UpdatingElement @ zigzag-wc.esm.js:1686
LitElement @ zigzag-wc.esm.js:2561
ZigzagWC @ zigzag-wc.esm.js:11052
ZigzagPanel @ lit-element.js:67
(anonymous) @ VM6:1
(anonymous) @ chunk.fd676b7a45305bcf907b.js:1
(anonymous) @ chunk.fd676b7a45305bcf907b.js:1
Promise.then (async)
value @ chunk.fd676b7a45305bcf907b.js:1
value @ chunk.fd676b7a45305bcf907b.js:1
performUpdate @ app.e45b0549.js:10297
_enqueueUpdate @ app.e45b0549.js:10297
async function (async)
_enqueueUpdate @ app.e45b0549.js:10297
requestUpdateInternal @ app.e45b0549.js:10297
initialize @ app.e45b0549.js:10297
C @ app.e45b0549.js:10297
r @ chunk.fd676b7a45305bcf907b.js:1
(anonymous) @ VM6:1
value @ app.e45b0549.js:39363
value @ app.e45b0549.js:39363
_currentLoadProm.l.then._currentLoadProm @ app.e45b0549.js:39363
Promise.then (async)
value @ app.e45b0549.js:39363
performUpdate @ app.e45b0549.js:10297
_enqueueUpdate @ app.e45b0549.js:10297
async function (async)
_enqueueUpdate @ app.e45b0549.js:10297
requestUpdateInternal @ app.e45b0549.js:10297
set @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
update @ app.e45b0549.js:10297
__commitTemplateResult @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
a @ app.e45b0549.js:10297
H.render @ app.e45b0549.js:10297
update @ app.e45b0549.js:10297
performUpdate @ app.e45b0549.js:10297
_enqueueUpdate @ app.e45b0549.js:10297
async function (async)
_enqueueUpdate @ app.e45b0549.js:10297
requestUpdateInternal @ app.e45b0549.js:10297
set @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
update @ app.e45b0549.js:10297
__commitTemplateResult @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
update @ app.e45b0549.js:10297
__commitTemplateResult @ app.e45b0549.js:10297
commit @ app.e45b0549.js:10297
a @ app.e45b0549.js:10297
H.render @ app.e45b0549.js:10297
update @ app.e45b0549.js:10297
performUpdate @ app.e45b0549.js:10297
_enqueueUpdate @ app.e45b0549.js:10297
async function (async)
_enqueueUpdate @ app.e45b0549.js:10297
requestUpdateInternal @ app.e45b0549.js:10297
set @ app.e45b0549.js:10297
value @ app.e45b0549.js:44533
async function (async)
value @ app.e45b0549.js:44533
handleEvent @ app.e45b0549.js:10297
__boundHandleEvent @ app.e45b0549.js:10297
x @ app.e45b0549.js:10297
E @ app.e45b0549.js:10297
w @ app.e45b0549.js:10297
(anonymous) @ app.e45b0549.js:10297
_propertiesChanged @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_invalidateProperties @ app.e45b0549.js:10297
_setProperty @ app.e45b0549.js:10297
Object.defineProperty.set @ app.e45b0549.js:10297
_locationChanged @ app.e45b0549.js:40448
V @ app.e45b0549.js:10297
w @ app.e45b0549.js:10297
_ @ app.e45b0549.js:10297
_propertiesChanged @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_invalidateProperties @ app.e45b0549.js:10297
_setProperty @ app.e45b0549.js:10297
Object.defineProperty.set @ app.e45b0549.js:10297
__computeRoutePath @ app.e45b0549.js:41607
V @ app.e45b0549.js:10297
w @ app.e45b0549.js:10297
_ @ app.e45b0549.js:10297
_propertiesChanged @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_invalidateProperties @ app.e45b0549.js:10297
(anonymous) @ app.e45b0549.js:10297
_propertiesChanged @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_flushProperties @ app.e45b0549.js:10297
_invalidateProperties @ app.e45b0549.js:10297
_setProperty @ app.e45b0549.js:10297
Object.defineProperty.set @ app.e45b0549.js:10297
_urlChanged @ app.e45b0549.js:40448
(anonymous) @ app.e45b0549.js:10297
fire @ app.e45b0549.js:10297
_globalOnClick @ app.e45b0549.js:40448
(anonymous) @ app.e45b0549.js:10297
Show 43 more frames from Library code
I think I have the latest plugin-render-pixi.esm.js dated 06/01/2021 23:06 size 4220 Ko
Got them using GitHub desktop on https://github.com/Samantha-uk/one.git
https://pixijs.io/examples/#/demos-basic/container.js
run correctly
Thank you @DrCoolzic. That should be the latest plugin for pixi. I'm going to modify it so the plugin version number is displayed when it loads so we can remove any question.
@DrCoolzic ... sorry it has taken so long, my build system broke (it turns out as a result of an update to one of the packages I depend on).
I've updated plugin-render-pixi so it now prints its version upon loading so we can be sure you've the right version.
You should see this in your console
Zigzag [plugin-render-pixi] ℹ plugin:plugin-render-pixi v0.1.3 api v1.0.0
Please let me know the outcome.
Unfortunately I will not be able to test zigzag in the next days.
I have reported a bug on ZHA network construction home-assistant/core#44954 and therefore I do not have ZHA running anymore. I am currently performing some tests using deCONZ. It will probably take few days before I reconstruct my network using ZHA.
As soon as I am ready I will let you know
When I last looked at deCONZ it did not seem to provide zag info, otherwise I would actively develop a plugin-data-deconz
deCONZ alone has the capability to display zags (even if less pretty that what you are doing :) )
True.
After some digging I see that the deCONZ C++ library exposes neighbor info (Used for Zags) (https://phoscon.de/deconz-cpp/d1/d77/node_8h_source.html).
When I had a play with their REST API some months ago, I could see nothing exposing neighbor info, the REST documentation still shows nothing ... however in the source there appears to be a request that looks like it would return neighbor info // GET /api/<apikey>/lights/<id>/connectivity.
Do you still have a deCONZ setup operational? Perhaps we could give it a try?
Also, it may make sense to move this to the Zigzag Discord forum.
With the new version it now display the graph but was still slightly offset.
So I cleared Chrome cache and restarted it and it works
@Samantha-uk I think the querying the neighbour table is default disabled and have one button for "LQI" in the GUI for activating the scan . Its recommended not having it running then its slowing down the network and the host in the log run.
Probably not your problem but some nodes/link are not displayed in the graph.
FYI please read home-assistant/core#44954 (comment)
@Samantha-uk I think the querying the neighbour table is default disabled and have one button for "LQI" in the GUI for activating the scan . Its recommended not having it running then its slowing down the network and the host in the log run.
I think the neighbour scan in ZHA/Zigpy defaults to about 4 hours, but it is possible to specify a shorter period by adding the following to your configuration.yaml
zha:
zigpy_config:
topology_scan_period: 20
I recall that this (20 minutes) is the minimum time that zigpy allows at present.
I shall investigate if I can add a scan neighbours now button ...
Probably not your problem but some nodes/link are not displayed in the graph.
FYI please read home-assistant/core#44954 (comment)
Nods.
I've the same issue for some nodes in my mesh, I think it is battery based nodes that experience this ... I suspect they are sleepy devices. However, my understanding of the Zigbee specification (heavy & complex) is that their parent nodes should cache their relationship so that they can store & forward any messages for their children. I'm looking into it ...
Our S-UK i still running your classic 1 (not one) and it was depending on scans being done by zha-map. But I think then the ZHA-visualising was implemented in ZHA its being done in ZHA. I was trying disabling (renaming) zha-map but was not getting any links in ZigZag so i was enabling it again and can triggering neighbour scans with HA services and lits looks working good.
I dont knowing if the two functions is doing bad things in the system but i think its only @Adminiuga that is knowing that. One thing with the AH service from zh-map is that the system is canceling the scan if doing it to frequently (for not blocking the network with unnecessary communications).
You supposed "network scan" button sound being one great thing in the GUI but the time restriction is making it little tricky getting it working well (with novice users).
If its possible reading the cooldown time for the network scan from ZHA / zigpy and graying the botun out and perhaps the remaining cooldown time being displayed wold being great but perhaps not possible.
If understand correctly the problem is that scanning the network uses a lot of resources just to be ready to display the graph correctly. If this is the case it is bad as user will only look at the network graph in case of problem or during construction of the network. Therefore it probably make sense to only scan on demand. But as @MattWestb is mentioning a novice user should not have to worry about details. But I like the idea of having a scan button that need to be pushed in order to display the graph. Other option would be to scan when a user load the Zigzag network graph (if possible?)...
For normal user cases is no problem but some users having over 200++ devices then its being more problematic with the communication and therefore its the system limiting the scans.
The system is doing their schedule and its OK but then you is doing changes like adding, moving and repairing devices its can being good getting the map updated by user interaction.
The maps is one visualization of the network but all LQI and active links is not real time thing and its being made as one tool for helping the user getting one picture of its there network and understanding it better.
If implanting one real good real time monitoring visual map then the is getting large performance problem also in smaller system.
I really would like to get near real time updates in ZigZag, the use case is when someone is trying to track down a network comms issue that may be affected by either the position of a Zig or interference from other systems (WiFi etc).
My goal would be for Zigzag to receive these updates in near real time and refresh the display (with perhaps some visual indication that a Zig/Zag has changed). I would dearly love to incorporate some of the sort of data feed that one might see in WireShark ... but that is a ways off at present.
At present, I'm working towards this by building Bedrock, which will be a Deno based docker add-in for HA (I don't want to have to learn python lol) ... a little like the approach that nodeRed takes. The plan is for it to do the "heavy-lifting" of scanning/etc and just provide an event feed to Zigzag.
Even with a large Zigbee mesh I don't feel (from my reading) that more frequent "status" scans are likely to add a huge amount of traffic ... but we shall see ... if rather than doing a full mesh sweep, a single problem Zig was targeted for such requests it would likely be very low.
Lady S you have great imagination !!!
My experience of deCONZ and little larger network with continuous pulling the router for the neighbor table is going to killing the network in the radio layer and / or in the host side if running for longer times.
But I think doing like deCONZ (have on button LQI) for doing one intens pulling in combination with time limit (so the user cant leaving it on and "forgetting it") is one go and worth to trying if interest.
Perhaps with one red warning with the danger if stressing the network.
One more interesting thing its that all router device (at least zigbee 3 ones) can also scanning the radio channels and reporting it back to the system but i dont knowing how the impact of the system is being then doing that. Taking one look on https://github.com/zigpy/zigpy-znp#energy-scan its describing energy scan doing on TI coordinator (the coordinator is technically one normal router with the trust center rolle).
If knowing the current zigbee channel being used and then collecting all energy scans from the routers in the mesh its can being very nice visualised and making it possible finding some bad or god matrix that is better for the system. And perhaps clicking on one router and getting energy scans "live" in the GUI.
Then radio interference can being very nasty and tricky to pinning out i think its can being one great tool for user to solving this kind of problem.
Do you have trying listening on music with one bluetooth headset and using the microwave oven ?
Very likely you getting the head set compleet disconnected and with luck only very bad "hacked" music (BT is using the same frequencies and zigbee but is using jumping channels so its more "immune" for interference).