search

Scrounger / ioBroker.vis-materialdesign

ioBroker Material Design Widgets are based on Google's material design guidelines. The adapter uses different libraries.
https://forum.iobroker.net/topic/42185/test-adapter-material-design-widgets-v0-5-x
MIT License
59 stars 39 forks source link

jason chart : Editor/Laufzeit Unterschiedlich #151

Open JBSullivan opened 3 years ago

JBSullivan commented 3 years ago

Adapter Version: 0.4.2 VIS Editor 1.3.8 WebServer 3.3.0

Editor Vorschau ist OK, im Laufzeit Bild fehlt so ziemlich alles - irgend eine Idee?

image

image

Scrounger commented 3 years ago

Bitte teste die aktuelle github version, da müsste das schon gefixt sein.

Falls nicht wird zwingend folgendes wird benötigt: verwendeter json string export deines widgets consolen log zur runtime (F12)

Bei Fehlern immer das bug report template vollständig ausfüllen

JBSullivan commented 3 years ago

OK, der Fehler mit dem Laufzeit Bild scheint mit der aktuellen Version aus dem GIT behoben zu sein. Dafür gibt es ein neues Phänomen.

Über ein javascript passe ich verschiedene Parameter für die Ansicht an und hole alle 30 Minuten den neuen Datenbestand ab. Offensichtlich aktualisiert sich das widget aber zwichendurch ebenfalls und verwendet dann die Parameter die im VIS Editor eingestellt sind.

So kommt es, das es je nach Zeit zwei unterschiedliche Ansichten des Diagramm gibt. Einmal das, welches durch meinen js Code generiert wird und einmal jenes, welches auf den Einstellungen des VIS Editors beruht.

hier meine Version incl. js-code Schnipsel:

var graphData = {"tooltip_AppendText": " Watt","yAxis_id": 1,"type": "bar","displayOrder": 2,"barIsStacked": true,"color":"blue","barStackId":1,"datalabel_rotation":-90,"datalabel_color":"lightblue","datalabel_fontSize":10}; graphData.data = graphTimeData1; graphAllData.push(graphData); graphData = {"tooltip_AppendText": " Watt","yAxis_id": 1,"type": "bar","displayOrder": 1,"barIsStacked": true,"color":"red","barStackId":1,"datalabel_rotation":-90,"datalabel_color":"lightblue","datalabel_fontSize":10};

image

Hier der selbe Graph, welcher allerdings auf den Widget Einstellungen beruht - siehe Farbschema Amber.

image

BtW: Ich habe festgestellt, das im Menüpunkt "Tooltip Layout" der eingefügte Text Anhang nicht angezeigt wird. Aus diesem Grund habe ich auch den Tooltip Text, oben in meinen js-code eingebaut.

Scrounger commented 3 years ago

Das bezweifle ich, der chart wird nur aktualisert wenn die daten des json sich ändern und wenn man an den Theme Einstellungen über Adapter settings geändert hat.

  1. Klick mal den Button Theme verwenden, damit hier keine Bindings mehr verwendet werden und die neue Methode genutzt wird
  2. debug modus aktivieren, runtime neu laden und nach dem das phänomen aufgetreten ist, das vollständige consolen log (F12, debug modus) posten. Ohne das kann ich nicht helfen!
JBSullivan commented 3 years ago

Möglicherweise hat es was mit dem Browser Cache zu tun. Heute Morgen z.B. wurden mir im Laufzeitbild trotz mehrmaliger Aktualisierung (F5) immer noch die alten Daten von gestern angezeigt, obwohl im json Datenpunkt bereits aktualisierte Daten vorhanden waren.

Habe es jetzt so gemacht, wie du oben geschrieben hast und werde dann F12 drücken, sobald das Phänomen wieder auftritt.

JBSullivan commented 3 years ago

So, gerade noch drüber gesprochen, passiert es wieder. Hier die Fehler die unter F12 aufgepopt sind.

index.html#070_PV_Prognose:1 Failed to find a valid digest in the 'integrity' attribute for resource 'http://xxx.xxx.xxx.xxxx:8082/vis/widgets/materialdesign/lib/raw/sentry/bundle.min.js' with computed SHA-256 integrity 'J7PbSqMvbqR4Xaqpc8fyJq+uNYam02vi6B8830eoFtA='. The resource has been blocked.

DevTools failed to load SourceMap: Could not load content for http://xxx.xxx.xxx.xxx:8082/lib/js/socket.io.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

[JSON Chart w02886] widget setting: {"_data":{"wid":"w02886","oid":"javascript.0.SolarForecast.JSONGraph","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartType":"bar","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"g_legendLayout":true,"g_tooltipLayout":true,"mdwDebug":false,"g_barLayout":true,"showTooltip":"true","tooltipMode":"nearest","tooltipTimeFormats":"{\"millisecond\":\"lll:ss\",\"second\":\"lll:ss\",\"minute\":\"lll\",\"hour\":\"lll\",\"day\":\"lll\",\"week\":\"lll\",\"month\":\"lll\",\"quarter\":\"lll\",\"year\":\"lll\"}","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":true,"tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"Verdana, Geneva, sans-serif","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","g_yAxisLayout":true,"yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#d7cec1","yAxisValueFontFamily":"Verdana, Geneva, sans-serif","yAxisValueFontSize":"12","yAxisValueDistanceToAxis":"0","g_xAxisLayout":true,"xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#d7cec1","xAxisValueFontFamily":"Verdana, Geneva, sans-serif","xAxisValueFontSize":"12","xAxisDistanceBetweenTicks":"0","xAxisValueDistanceToAxis":"0","xAxisShowAxis":true,"xAxisShowAxisLabels":true,"xAxisShowGridLines":false,"xAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_gridlines","xAxisShowTicks":true,"xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"35","g_chartLayout":true,"backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","barWidth":"90","xAxisTickLength":"10","axisLabelAutoSkip":true,"xAxisGridLinesWitdh":"0.5","xAxisOffset":true,"xAxisLabelUseTodayYesterday":true,"chartPaddingLeft":"-2","chartPaddingRight":"-2","showLegend":"true","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"Verdana, Geneva, sans-serif","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","colorScheme":"material.amber","tooltipArrowSize":"10","tooltipBoxRadius":"2","xAxisOffsetGridLines":true,"tooltipBodyAppend":"Watt","tooltipValueMinDecimals":"0","animationDuration":"-1","disableHoverEffects":false,"tooltipDistanceToBar":"10","tooltipXpadding":"0","tooltipYpadding":"0","tooltipValueMaxDecimals":"2","xAxisMaxLabel":"4","tooltipTitleMarginBottom":"12","chartPaddingTop":"50","tooltipLabelUseTodayYesterday":false,"xAxisZeroLineWidth":"","chartPaddingBottom":"-1","xAxisTitle":"","legendBoxWidth":"100","legendPadding":"10","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","tooltipPosition":"nearest","tooltipBodyAlignment":"center","debug":true,"legendDistanceToChart":"10"},"_cid":".map3328","_computedAttrs":{},"wid":"w02886","oid":"javascript.0.SolarForecast.JSONGraph","g_fixed":false,"g_visibility":false,"g_css_font_text":true,"g_css_background":false,"g_css_shadow_padding":false,"g_css_border":true,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","chartType":"bar","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"g_legendLayout":true,"g_tooltipLayout":true,"mdwDebug":false,"g_barLayout":true,"showTooltip":"true","tooltipMode":"nearest","tooltipTimeFormats":"{\"millisecond\":\"lll:ss\",\"second\":\"lll:ss\",\"minute\":\"lll\",\"hour\":\"lll\",\"day\":\"lll\",\"week\":\"lll\",\"month\":\"lll\",\"quarter\":\"lll\",\"year\":\"lll\"}","tooltipBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_background","tooltipShowColorBox":true,"tooltipTitleFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_title","tooltipTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.tooltip_title","tooltipTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_title","tooltipBodyFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.tooltip_text","tooltipBodyFontFamily":"Verdana, Geneva, sans-serif","tooltipBodyFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.tooltip_text","g_yAxisLayout":true,"yAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.y_axis_title","yAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.y_axis_title","yAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.y_axis_title","yAxisValueLabelColor":"#d7cec1","yAxisValueFontFamily":"Verdana, Geneva, sans-serif","yAxisValueFontSize":"12","yAxisValueDistanceToAxis":"0","g_xAxisLayout":true,"xAxisPosition":"bottom","xAxisTicksSource":"auto","xAxisTitleColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_title","xAxisTitleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.charts.x_axis_title","xAxisTitleFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.x_axis_title","xAxisValueLabelColor":"#d7cec1","xAxisValueFontFamily":"Verdana, Geneva, sans-serif","xAxisValueFontSize":"12","xAxisDistanceBetweenTicks":"0","xAxisValueDistanceToAxis":"0","xAxisShowAxis":true,"xAxisShowAxisLabels":true,"xAxisShowGridLines":false,"xAxisGridLinesColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_gridlines","xAxisShowTicks":true,"xAxisZeroLineColor":"#mdwTheme:vis-materialdesign.0.colors.charts.x_axis_zeroline","xAxisMinRotation":"0","xAxisMaxRotation":"35","g_chartLayout":true,"backgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background","chartAreaBackgroundColor":"#mdwTheme:vis-materialdesign.0.colors.charts.background_chart","globalColor":"#mdwTheme:vis-materialdesign.0.colors.charts.global","barWidth":"90","xAxisTickLength":"10","axisLabelAutoSkip":true,"xAxisGridLinesWitdh":"0.5","xAxisOffset":true,"xAxisLabelUseTodayYesterday":true,"chartPaddingLeft":"-2","chartPaddingRight":"-2","showLegend":"true","legendPosition":"right","legendFontColor":"#mdwTheme:vis-materialdesign.0.colors.charts.legend","legendFontFamily":"Verdana, Geneva, sans-serif","legendFontSize":"#mdwTheme:vis-materialdesign.0.fontSizes.charts.legend","legendPointStyle":"true","colorScheme":"material.amber","tooltipArrowSize":"10","tooltipBoxRadius":"2","xAxisOffsetGridLines":true,"tooltipBodyAppend":"Watt","tooltipValueMinDecimals":"0","animationDuration":"-1","disableHoverEffects":false,"tooltipDistanceToBar":"10","tooltipXpadding":"0","tooltipYpadding":"0","tooltipValueMaxDecimals":"2","xAxisMaxLabel":"4","tooltipTitleMarginBottom":"12","chartPaddingTop":"50","tooltipLabelUseTodayYesterday":false,"xAxisZeroLineWidth":"","chartPaddingBottom":"-1","xAxisTitle":"","legendBoxWidth":"100","legendPadding":"10","titleLayout":"#mdwTheme:vis-materialdesign.0.fontSizes.card.title","titleFontFamily":"#mdwTheme:vis-materialdesign.0.fonts.card.title","colorBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background","colorTitleSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_title","colorTextSectionBackground":"#mdwTheme:vis-materialdesign.0.colors.card.background_body","colorTitle":"#mdwTheme:vis-materialdesign.0.colors.card.title","tooltipPosition":"nearest","tooltipBodyAlignment":"center","debug":true,"legendDistanceToChart":"10","_bubbleBindings":{},"__bindEvents":{"class":[{"name":"class"}],"backgroundColor":[{"name":"backgroundColor"}],"wid":[{"name":"wid"}]},"_bindings":3}

Scrounger commented 3 years ago

So, gerade noch drüber gesprochen, passiert es wieder. Hier die Fehler die unter F12 aufgepopt sind.

index.html#070_PV_Prognose:1 Failed to find a valid digest in the 'integrity' attribute for resource 'http://xxx.xxx.xxx.xxxx:8082/vis/widgets/materialdesign/lib/raw/sentry/bundle.min.js' with computed SHA-256 integrity 'J7PbSqMvbqR4Xaqpc8fyJq+uNYam02vi6B8830eoFtA='. The resource has been blocked.

DevTools failed to load SourceMap: Could not load content for http://xxx.xxx.xxx.xxx:8082/lib/js/socket.io.js.map: HTTP error: status code 404, net::ERR_HTTP_RESPONSE_CODE_FAILURE

Das bring mir leider gar nichts, brauch das vollständige log, wie ich geschrieben habe

2\. debug modus aktivieren, runtime neu laden und nach dem das phänomen aufgetreten ist, das vollständige consolen log (F12, debug modus) posten. Ohne das kann ich nicht helfen!