Apex Chart

[vitjurasek]

Lze prosím nějak ovlivnit plovoucí tooltip s hodnotou? Na počítači to je super, ale ne mobilu po kliknutí do grafu skryje tooltip s cenou všechny sloupce a nedá se to pořádně použít. Případně jak donutit tooltip zobrazovat se fixně na jedné pozici, ideálně nad grafem?

A ještě - není k dispozici komponenta, která by vypsala ceny v tabulce?

moc díky

[rnovacek]

Tohle tomu tooltipu trochu pomůže, ale perfektní to není:

apex_config:
  xaxis:
    tooltip:
      enabled: false
  tooltip:
    fixed:
      enabled: true
      position: topRight
      offsetY: -54

S komponentou na tabulku neporadím, taky by se mi hodila.

[vitjurasek]

tak to hodně pomohlo na mobilu, moc díky!

[Paja-git]

S komponentou na tabulku neporadím, taky by se mi hodila.
Zkus tohle, udělá to csv.
https://community.home-assistant.io/t/export-sensor-data-to-text-file/46804/3

[ondras12345]

Jestli jde jen o zobrazeni tabulky (a ne o csv vystup pro dalsi strojove zpracovani), tak na to by mohla stacit markdown karta se sablonou, ktera si sahne na {{ states.sensor.current_spot_electricity_price.attributes }} a formatuje je do HTML tabulky.

[rnovacek]

@ondras12345 Dobrej tip, díky.

Zkusil jsem udělat takovou tabulku s použitím Lovelace-HTML-Jinja2-Template-card:

type: custom:html-template-card
ignore_line_breaks: true
content: |
  <style>
    table {
      border-collapse: collapse;
      width: 100%;
      font-size: 90%;
      line-height: 100%;
    }
    .chart {
      height: 100%;
      background-color: blue;
      opacity: 0.3;
      position: absolute;
      inset: 0;
    }
  </style> <table border>
    <thead>
      <tr>
        <th>Den</th>
        <th>Čas</th>
        <th>Cena spot</td>
        {% if states.sensor.current_buy_electricity_price %}
          <th>Cena nákup</td>
        {% endif %}
        {% if states.sensor.current_sell_electricity_price %}
          <th>Cena prodej</td>
        {% endif %}
      </tr>
    </thead>

    {% set today = now().date() %}
    {% set current_hour = now().hour %}
    {% set ns = namespace(max_price=10) %}
    {% for time, price in states.sensor.current_spot_electricity_price.attributes.items() %}
      {%- set dt = time | as_datetime(None) -%}
      {%- if not dt -%}
        {%- continue -%}
      {%- endif -%}
      {% set ns.max_price = max(ns.max_price, price | abs) %}
      {% if states.sensor.current_buy_electricity_price %}
        {% set buy = states.sensor.current_buy_electricity_price.attributes[time] %}
        {% set ns.max_price = max(ns.max_price, buy | abs) %}
      {% endif %}
      {% if states.sensor.current_sell_electricity_price %}
      {% set sell = states.sensor.current_sell_electricity_price.attributes[time] %}
        {% set ns.max_price = max(ns.max_price, sell | abs) %}
      {% endif %}
    {% endfor %}

    {% for time, cost in
    states.sensor.current_spot_electricity_price.attributes.items() -%}
      {%- set dt = time | as_datetime(None) -%}
      {%- if not dt -%}
        {%- continue -%}
      {%- endif -%}
      
      <tr style="{% if dt.date() == today and dt.hour == current_hour %}background-color: lightgray{% endif %}">
         <td>
          {%- if dt.date() == today -%}
            Dnes
          {%- else -%}
            Zítra
          {%- endif -%}         
        </td>
        <td>
          {{ dt.hour -}}:00 - {{ (dt + timedelta(hours=1)).hour }}:00
        </td>
        <td style="position: relative">
          {% set percent = cost | abs / ns.max_price * 50 %}
           {% if cost < 0 %}
            <div class="chart" style="left: {{ 50 - percent }}%; width: {{ percent }}%; background-color: red"></div>
          {% else %}
            <div class="chart" style="left: 50%; width: {{ percent }}%"></div>
          {% endif %}
          {{- cost | round(2) -}}
        </td>
        {% if states.sensor.current_buy_electricity_price %}
        <td style="position: relative">
           {% set buy = states.sensor.current_buy_electricity_price.attributes[time] %}
           {% set percent = buy | abs / ns.max_price * 50 %}
           {% if buy < 0 %}
            <div class="chart" style="left: {{ 50 - percent }}%; width: {{ percent }}%; background-color: red"></div>
          {% else %}
            <div class="chart" style="left: 50%; width: {{ percent }}%"></div>
          {% endif %}
           {{- buy | round(2) -}}
        </td>
        {% endif %}
        {% if states.sensor.current_sell_electricity_price %}
        <td style="position: relative">
          {% set sell = states.sensor.current_sell_electricity_price.attributes[time] %}
          {% set percent = sell | abs / ns.max_price * 50 %}
          {% if sell < 0 %}
            <div class="chart" style="left: {{ 50 - percent }}%; width: {{ percent }}%; background-color: red"></div>
          {% else %}
            <div class="chart" style="left: 50%; width: {{ percent }}%"></div>
          {% endif %}
          {{- sell | round(2) -}}
        </td>
        {% endif %}
      </tr>
    {%- endfor -%}
  </table>

[vitjurasek]

Vyžaduje to kromě HTML Jinja ještě něco dalšího?
V developer modu mi to píše chybu 'None' has no attribute 'attributes'

[rnovacek]

@vitjurasek Předpokládalo to šablony pro nákupní/prodejní ceny. Předělal jsem to, aby to fungovalo i bez nich (upravil jsem ten komentář).

[vitjurasek]

zatím to stále píše chybu, ale zkusím se tomu trošku po práci pověnovat, moc díky!

[rnovacek]

@vitjurasek zkuste to teď, jěstě jsem tam opravil jednu chybu.