Open item chart (Analyzer) with rolling period (D, M, Y)

Setup, Configuration and Use Widgets
1

I was looking for a long time how to open the analyzer with a dynamic period like last month or last year. With “actionAnalyzerChartType” I only can select dynamic (which always starts with D) or fixed D,W,M,Y. But then it’s always the current calendar day/week/month/year and not the period. Never found a solution for this.

Before I had a separate chart page for every item, but this got really messy with all the pages :smirking_face:

My solution is now a popup widget where I just pass the item and the period:
The title I have to enter manually, because I didn’t find a way to get the item label in the widget.

Is it really not possible by default to open the analyzer with a rolling period? Or did I miss something?

Feedback welcome :slight_smile: E.g. if it is possible to have the title on top instead of the black bar (or alternatively hide bar). I think it was discussed here: Open popup with text in the navbar

OK, Update: f7-card instead f7-block did the trick:

f7-card:

image
image682×687 22 KB

f7-block:

image
image689×689 28 KB

version: 1
widgets:
  Chart_Popup:
    tags: []
    props:
      parameters:
        - context: item
          label: Item
          name: item
          required: true
          type: TEXT
        - default: M
          description: z.B. D, W, M, 2M, 6M, Y
          label: Zeitraum
          name: period
          required: false
          type: TEXT
        - description: Leer = Item-Name
          label: Titel
          name: title
          required: false
          type: TEXT
      parameterGroups: []
    component: f7-card
    config:
      style:
        background: transparent
        border: none
        box-shadow: none
        height: 100%
        margin: 0
        padding: 4px
        box-sizing: border-box
    slots:
      default:
        - component: oh-chart
          config:
            chartType: ""
            period: =props.period
            height: 100%
          slots:
            title:
              - component: oh-chart-title
                config:
                  text: =props.title || props.item
                  left: 8
                  top: 12
                  textStyle:
                    fontSize: 16
                    fontWeight: normal
                    color: "#ddd"
            grid:
              - component: oh-chart-grid
                config:
                  containLabel: true
                  top: 48
                  left: 8
                  right: 16
                  bottom: 8
            series:
              - component: oh-time-series
                config:
                  name: =props.title || props.item
                  item: =props.item
                  type: line
                  xAxisIndex: 0
                  yAxisIndex: 0
            xAxis:
              - component: oh-time-axis
                config:
                  gridIndex: 0
            yAxis:
              - component: oh-value-axis
                config:
                  gridIndex: 0
                  scale: true
            tooltip:
              - component: oh-chart-tooltip
                config:
                  show: true