pmeunier/grain - Change YDHYVLQS26KB25BEA4SAYFZ34CJEORCJLZVPVF5DNFV2YHFIEJXAC

Mise à jour de la page simulation avec le nouveau 'plot'

Created by pmeunier on March 10, 2026

YDHYVLQS26KB25BEA4SAYFZ34CJEORCJLZVPVF5DNFV2YHFIEJXAC

Dependencies

In channels

main

Change contents

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 2 [2.42]

B:BD[2.62] → [4.0:730]

  import { browser } from '$app/environment'
  import { onMount, tick } from 'svelte'
  import type { Writable } from 'svelte/store'
  import { get } from 'svelte/store'
  import { getContext } from 'svelte'
  import type * as P from 'plotly.js-dist-min'
  import * as Grain from '../../../../../grain-types'
  import {
      chooseScale,
      relayout,
      modeBarButtonsToRemove,
  } from '../../../../../plot'
  import type { Sample } from '../../../../../plot'
  import type { Derived, PVGIS, PVGISInputs } from '../calcul'
  import * as calcul from '../calcul'
  import PlusCircle from '../../../../PlusCircle.svelte'
  import XCircle from '../../../../XCircle.svelte'
  import Question from '../../../../Question.svelte'

[2.62]

[2.695]

    import { browser } from '$app/environment'
    import { onMount, tick } from 'svelte'
    import type { Writable } from 'svelte/store'
    import { get } from 'svelte/store'
    import { getContext } from 'svelte'
    import type * as P from 'plotly.js-dist-min'
    import * as Grain from '../../../../../grain-types'
    import {
        chooseScale,
        relayout,
        modeBarButtonsToRemove,
    } from '../../../../../plot'
    import type { Sample } from '../../../../../plot'
    import type { Derived, PVGIS, PVGISInputs } from '../calcul'
    import * as calcul from '../calcul'
    import PlusCircle from '../../../../PlusCircle.svelte'
    import XCircle from '../../../../XCircle.svelte'
    import Question from '../../../../Question.svelte'

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 21 [2.42]

B:BD[2.696] → [4.731:822]

  let { data = $bindable(), pvgis_loading = true } = $props()
  const data_ = $state(data)

[2.696]

[2.789]

    let { data = $bindable(), pvgis_loading = true } = $props()
    const data_ = $state(data)

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 24 [2.42]

B:BD[2.790] → [4.823:1607]

  let s: Derived = getContext('simulation')
  let prms: Writable<
  {
      prm: null | number
      nom: string
      prenom: string
      siret: string
      pro: boolean
      consentement: boolean
      releve?: string
      numerorue?: string
      codeinsee?: string
      serie?: string
  }[]
  > = getContext('prms')
  let prms_modified: Writable<boolean> = getContext('prms_modified')
  let profils: Writable<{ type: string; conso: number }[]> =
      getContext('profils')
  let profils_modified: Writable<boolean> = getContext('profils_modified')
  const soleil: Writable<Sample> = getContext('soleil')
  const expert: Writable<boolean> = getContext('expert')
  let _communaute: Writable<
  (Grain.Communaute & { isMoving?: boolean }) | null
  > = getContext('communaute')

[2.790]

[2.1076]

    let s: Derived = getContext('simulation')
    let prms: Writable<
        {
            prm: null | number
            nom: string
            prenom: string
            siret: string
            pro: boolean
            consentement: boolean
            releve?: string
            numerorue?: string
            codeinsee?: string
            serie?: string
        }[]
    > = getContext('prms')
    let prms_modified: Writable<boolean> = getContext('prms_modified')
    let profils: Writable<{ type: string; conso: number }[]> =
        getContext('profils')
    let profils_modified: Writable<boolean> = getContext('profils_modified')
    const soleil: Writable<Sample> = getContext('soleil')
    const expert: Writable<boolean> = getContext('expert')
    let _communaute: Writable<
        (Grain.Communaute & { isMoving?: boolean }) | null
    > = getContext('communaute')

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 49 [2.42]

B:BD[2.1077] → [4.1608:2370]

  const annee = $derived.by(() => {
      console.log('derived by')
      let annee = data.annee
      if (!annee) {
          annee = {}
      }
      for (let i = 0; i < $prms.length; i++) {
          const p = $prms[i]
          if (p.releve) {
              annee[p.prm || i] = []
              for (const j of p.releve.split('\n')) {
                  const l = j.split(/;|,| /)
                  if (l.length >= 2) {
                      const d = new Date(l[0])
                      const v = parseInt(l[1])
                      if (d && !isNaN(v)) {
                          annee[p.prm || i].push(v)
                      }
                  }
              }
              console.log(annee[p.prm || i])
          }
      }
      return annee
  })

[2.1077]

[3.307742]

    const annee = $derived.by(() => {
        console.log('derived by')
        let annee = data.annee
        if (!annee) {
            annee = {}
        }
        for (let i = 0; i < $prms.length; i++) {
            const p = $prms[i]
            if (p.releve) {
                annee[p.prm || i] = []
                for (const j of p.releve.split('\n')) {
                    const l = j.split(/;|,| /)
                    if (l.length >= 2) {
                        const d = new Date(l[0])
                        const v = parseInt(l[1])
                        if (d && !isNaN(v)) {
                            annee[p.prm || i].push(v)
                        }
                    }
                }
                console.log(annee[p.prm || i])
            }
        }
        return annee
    })

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 75 [2.42]

B:BD[3.307743] → [4.2371:2723]

  function addPrm() {
      console.log('ajouter un compteur')
      prms.update((prms) => {
          prms.push({
              prm: null,
              nom: '',
              prenom: '',
              siret: '',
              pro: true,
              consentement: false,
          })
          return prms
      })
      prms_modified.set(true)
  }

[3.307743]

[2.1292]

    function addPrm() {
        console.log('ajouter un compteur')
        prms.update((prms) => {
            prms.push({
                prm: null,
                nom: '',
                prenom: '',
                siret: '',
                pro: true,
                consentement: false,
            })
            return prms
        })
        prms_modified.set(true)
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 91 [2.42]

B:BD[2.1293] → [4.2724:2859]

  const pvgis: Writable<{ pvgis: null | PVGIS; loading: boolean }> =
      getContext('pvgis')
  let pvgis_: null | PVGISInputs = null

[2.1293]

[2.1434]

    const pvgis: Writable<{ pvgis: null | PVGIS; loading: boolean }> =
        getContext('pvgis')
    let pvgis_: null | PVGISInputs = null

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 95 [2.42]
B:BD[2.1435] → [4.2860:2894]
```
  let prm_loading = $state(false)
```
[2.1435]
[2.1471]
```
    let prm_loading = $state(false)
```
Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 97 [2.42]
B:BD[2.1472] → [4.2895:2921]
```
  let initialised = false
```
[2.1472]
[2.1500]
```
    let initialised = false
```

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 99 [2.42]

B:BD[2.1501] → [4.2922:3018]

  let puissance = 0
  let communaute: null | (Grain.Communaute & { isMoving?: boolean }) = null

[2.1501]

[2.1601]

    let puissance = 0
    let communaute: null | (Grain.Communaute & { isMoving?: boolean }) = null

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 102 [2.42]
B:BD[2.1602] → [4.3019:3042]
```
  let Plotly: typeof P
```
[2.1602]
[2.1627]
```
    let Plotly: typeof P
```
Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 104 [2.42]
B:BD[2.1628] → [4.3043:3069]
```
  let erreur = $state('')
```
[2.1628]
[2.1656]
```
    let erreur = $state('')
```

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 106 [2.42]

B:BD[2.1657] → [4.3070:3923]

  onMount(async () => {
      Plotly = await import('plotly.js-dist-min')
      s.p.puissance.subscribe((value) => {
          puissance = value
          if (initialised) {
              updatePlot(puissance, communaute)
          }
      })
      _communaute.subscribe((value) => {
          communaute = value
          if (initialised) {
              updatePlot(puissance, communaute)
          }
      })
      pvgis.subscribe((pvgis) => {
          console.log('pvgis updated')
          if (initialised && pvgis.pvgis?.inputs != pvgis_) {
              pvgis_ = pvgis.pvgis?.inputs || null
              updatePlot(puissance, communaute)
          }
      })
      if ($prms.length) {
          for (let p of $prms) {
              p.consentement = false
          }
      }
      initialised = true
      updatePlot(puissance, communaute)
  })

[2.1657]

[2.2522]

    onMount(async () => {
        Plotly = await import('plotly.js-dist-min')
        s.p.puissance.subscribe((value) => {
            puissance = value
            if (initialised) {
                updatePlot(puissance, communaute)
            }
        })
        _communaute.subscribe((value) => {
            communaute = value
            if (initialised) {
                updatePlot(puissance, communaute)
            }
        })
        pvgis.subscribe((pvgis) => {
            console.log('pvgis updated')
            if (initialised && pvgis.pvgis?.inputs != pvgis_) {
                pvgis_ = pvgis.pvgis?.inputs || null
                updatePlot(puissance, communaute)
            }
        })
        if ($prms.length) {
            for (let p of $prms) {
                p.consentement = false
            }
        }
        initialised = true
        updatePlot(puissance, communaute)
    })

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 136 [2.42]
B:BD[2.2523] → [4.3924:3953]
```
  let plotStyle = $state('')
```
[2.2523]
[2.2554]
```
    let plotStyle = $state('')
```

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 138 [2.42]

B:BD[2.2555] → [4.3954:4339]

  let darkMode = false
  if (browser) {
      darkMode =
          window.matchMedia &&
          window.matchMedia('(prefers-color-scheme: dark)').matches
      window
                .matchMedia('(prefers-color-scheme: dark)')
                .addEventListener('change', (event) => {
                    darkMode = !!event.matches
                    redraw()
                })
  }

[2.2555]

[2.2934]

    let darkMode = false
    if (browser) {
        darkMode =
            window.matchMedia &&
            window.matchMedia('(prefers-color-scheme: dark)').matches
        window
            .matchMedia('(prefers-color-scheme: dark)')
            .addEventListener('change', (event) => {
                darkMode = !!event.matches
                redraw()
            })
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 151 [2.42]

B:BD[2.2935] → [4.4340:4453]

  let profils_ = $state(Grain.profils($expert))
  expert.subscribe((value) => (profils_ = Grain.profils(value)))

[2.2935]

[2.3052]

    let profils_ = $state(Grain.profils($expert))
    expert.subscribe((value) => (profils_ = Grain.profils(value)))

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 154 [2.42]

B:BD[2.3053] → [4.4454:4703]

  function addProfil() {
      profils.update((p) => {
          const prt = Object.keys(profils_)
          p.push({ type: prt[0], conso: 0 })
          return p
      })
      profils_modified.set(true)
      updatePlot(puissance, communaute)
  }

[2.3053]

[2.3218]

    function addProfil() {
        profils.update((p) => {
            const prt = Object.keys(profils_)
            p.push({ type: prt[0], conso: 0 })
            return p
        })
        profils_modified.set(true)
        updatePlot(puissance, communaute)
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 164 [2.42]

B:BD[2.3219] → [4.4704:4898]

  function delProfil(i: number) {
      profils.update((p) => {
          p.splice(i, 1)
          return p
      })
      profils_modified.set(true)
      updatePlot(puissance, communaute)
  }

[2.3219]

[2.3385]

    function delProfil(i: number) {
        profils.update((p) => {
            p.splice(i, 1)
            return p
        })
        profils_modified.set(true)
        updatePlot(puissance, communaute)
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 173 [2.42]

B:BD[2.3386] → [4.4899:4969]

  const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms))

[2.3386]

[2.3458]

    const sleep = (ms: number) => new Promise((r) => setTimeout(r, ms))

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 175 [2.42]
B:BD[2.3459] → [4.4970:5008]
```
  var lastRequest = performance.now()
```
[2.3459]
[2.3499]
```
    var lastRequest = performance.now()
```

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 177 [2.42]

B:BD[2.3500] → [4.5009:8496]

  async function refresh(event: SubmitEvent) {
      event.preventDefault()
      prms_modified.set(true)
      if ($prms) {
          prm_loading = true
          await tick()
          for (let i = 0; i < $prms.length; i++) {
              var file = document.getElementById(
                  `releve-${i}`
              ) as HTMLInputElement | null
              console.log('FILE', file?.files)
              if (file?.files?.length) {
                  var reader = new FileReader()
                  reader.readAsText(file.files[0], 'UTF-8')
                  let r: string | undefined = await new Promise((resolve) => {
                      reader.onload = function (evt) {
                          console.log(typeof evt.target?.result)
                          let result = evt.target?.result?.toString()
                          if (result) {
                              resolve(result)
                          } else {
                              resolve(undefined)
                          }
                      }
                  })
                  console.log('r', r)
                  $prms[i].releve = r
              }
              let siret = document.getElementById(
                  `siret-${i}`
              ) as HTMLInputElement | null
              if (siret?.value) {
                  let now = performance.now()
                  // Rate-limiting: pas plus de 7 requêtes par seconde.
                  if (now - lastRequest < 150) {
                      await sleep(150 - (now - lastRequest))
                  }
                  lastRequest = now
                  const resp = await fetch(
                      `https://recherche-entreprises.api.gouv.fr/search?q=${siret.value}`
                  )
                  if (resp.status == 200) {
                      type Ent = {
                          results: {
                              dirigeants: {
                                  nom: string
                                  prenoms: string
                              }[]
                              matching_etablissements: {
                                  libelle_voie: string
                                  commune: string
                              }[]
                          }[]
                      }
                      let ent: Ent = await resp.json()
                      console.log(
                          ent.results[0].matching_etablissements[0].commune
                      )
                      if (ent.results.length) {
                          $prms[i].nom = ent.results[0].dirigeants[0].nom
                          $prms[i].prenom =
                              ent.results[0].dirigeants[0].prenoms
                          $prms[i].codeinsee =
                              ent.results[0].matching_etablissements[0].commune
                          console.log($prms[i])
                      }
                  }
              }
          }
          console.log($prms)
          const resp = await fetch(
              `${Grain.server}/api/grain/projet/${data_.id || 'nouveau'}/prms`,
              {
                  method: 'POST',
                  body: JSON.stringify($prms),
              }
          )
          if (resp.ok) {
              data.annee = await resp.json()
          }
          prm_loading = false
          await tick()
      } else {
          erreur = 'La liste des PRMs est vide'
      }
      await updatePlot(puissance, communaute)
  }

[2.3500]

[2.7064]

    async function refresh(event: SubmitEvent) {
        event.preventDefault()
        prms_modified.set(true)
        if ($prms) {
            prm_loading = true
            await tick()
            for (let i = 0; i < $prms.length; i++) {
                var file = document.getElementById(
                    `releve-${i}`
                ) as HTMLInputElement | null
                console.log('FILE', file?.files)
                if (file?.files?.length) {
                    var reader = new FileReader()
                    reader.readAsText(file.files[0], 'UTF-8')
                    let r: string | undefined = await new Promise((resolve) => {
                        reader.onload = function (evt) {
                            console.log(typeof evt.target?.result)
                            let result = evt.target?.result?.toString()
                            if (result) {
                                resolve(result)
                            } else {
                                resolve(undefined)
                            }
                        }
                    })
                    console.log('r', r)
                    $prms[i].releve = r
                }
                let siret = document.getElementById(
                    `siret-${i}`
                ) as HTMLInputElement | null
                if (siret?.value) {
                    let now = performance.now()
                    // Rate-limiting: pas plus de 7 requêtes par seconde.
                    if (now - lastRequest < 150) {
                        await sleep(150 - (now - lastRequest))
                    }
                    lastRequest = now
                    const resp = await fetch(
                        `https://recherche-entreprises.api.gouv.fr/search?q=${siret.value}`
                    )
                    if (resp.status == 200) {
                        type Ent = {
                            results: {
                                dirigeants: {
                                    nom: string
                                    prenoms: string
                                }[]
                                matching_etablissements: {
                                    libelle_voie: string
                                    commune: string
                                }[]
                            }[]
                        }
                        let ent: Ent = await resp.json()
                        console.log(
                            ent.results[0].matching_etablissements[0].commune
                        )
                        if (ent.results.length) {
                            $prms[i].nom = ent.results[0].dirigeants[0].nom
                            $prms[i].prenom =
                                ent.results[0].dirigeants[0].prenoms
                            $prms[i].codeinsee =
                                ent.results[0].matching_etablissements[0].commune
                            console.log($prms[i])
                        }
                    }
                }
            }
            console.log($prms)
            const resp = await fetch(
                `${Grain.server}/api/grain/projet/${data_.id || 'nouveau'}/prms`,
                {
                    method: 'POST',
                    body: JSON.stringify($prms),
                }
            )
            if (resp.ok) {
                data.annee = await resp.json()
            }
            prm_loading = false
            await tick()
        } else {
            erreur = 'La liste des PRMs est vide'
        }
        await updatePlot(puissance, communaute)
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 265 [2.42]

B:BD[2.7065] → [4.8497:8569]

  let auto = 0
  let totalProd = $state(0)
  let totalConso = $state(0)

[2.7065]

[2.7143]

    let auto = 0
    let totalProd = $state(0)
    let totalConso = $state(0)

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 269 [2.42]

B:BD[2.7144] → [4.8570:9015]

  let somme: Sample = {
      hourly: {
          x: [],
          y: [],
      },
      daily: {
          x: [],
          y: [],
      },
      weekly: {
          x: [],
          y: [],
      },
      x: [],
      y: [],
      type: 'bar',
      line: {
          color: '#b81111',
          width: 1,
      },
      marker: {
          color: '#b81111',
          width: 1,
      },
      name: 'Consommation totale',
      bucket: 1,
  }

[2.7144]

[2.7643]

    let somme: Sample = {
        hourly: {
            x: [],
            y: [],
        },
        daily: {
            x: [],
            y: [],
        },
        weekly: {
            x: [],
            y: [],
        },
        x: [],
        y: [],
        type: 'bar',
        line: {
            color: '#b81111',
            width: 1,
        },
        marker: {
            color: '#b81111',
            width: 1,
        },
        name: 'Consommation totale',
        bucket: 1,
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 297 [2.42]

B:BD[2.7644] → [4.9016:9352]

  async function updatePv(
      puissance: number,
      communaute: (Grain.Communaute & { isMoving?: boolean }) | null
  ) {
      if (communaute?.isMoving) {
          return pvgis
      }
      pvgis_loading = true
      await calcul.updatePv(puissance, communaute, pvgis, soleil)
      pvgis_loading = false
      await tick()
  }

[2.7644]

[2.8004]

    async function updatePv(
        puissance: number,
        communaute: (Grain.Communaute & { isMoving?: boolean }) | null
    ) {
        if (communaute?.isMoving) {
            return pvgis
        }
        pvgis_loading = true
        await calcul.updatePv(puissance, communaute, pvgis, soleil)
        pvgis_loading = false
        await tick()
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 310 [2.42]

B:BD[2.8005] → [4.9353:9640]

  async function updatePlot(
      puissance: number,
      communaute: (Grain.Communaute & { isMoving?: boolean }) | null
  ) {
      console.log('isMoving', communaute?.isMoving)
      if (communaute?.isMoving) {
          return
      }
      if (!browser) {
          return
      }

[2.8005]

[2.8314]

    async function updatePlot(
        puissance: number,
        communaute: (Grain.Communaute & { isMoving?: boolean }) | null
    ) {
        console.log('isMoving', communaute?.isMoving)
        if (communaute?.isMoving) {
            return
        }
        if (!browser) {
            return
        }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 322 [2.42]

B:BD[2.8315] → [4.9641:10172]

      await updatePv(puissance, communaute)
      console.log('updated')
      prm_loading = true
      let auto_ = await calcul.updatePlot(
          annee || {},
          $profils,
          profils_,
          somme,
          soleil
      )
      prm_loading = false
      auto = auto_.auto
      totalProd = auto_.totalProd
      totalConso = auto_.totalConso
      console.log('updated auto', auto, totalProd, totalConso)
      if (!Plotly) {
          Plotly = await import('plotly.js-dist-min')
      }
      redraw()
  }

[2.8315]

[2.8861]

        await updatePv(puissance, communaute)
        console.log('updated')
        prm_loading = true
        let auto_ = await calcul.updatePlot(
            annee || {},
            $profils,
            profils_,
            somme,
            soleil
        )
        prm_loading = false
        auto = auto_.auto
        totalProd = auto_.totalProd
        totalConso = auto_.totalConso
        console.log('updated auto', auto, totalProd, totalConso)
        if (!Plotly) {
            Plotly = await import('plotly.js-dist-min')
        }
        redraw()
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 343 [2.42]
B:BD[2.8862] → [4.10173:10232]
```
  let has_plot = { has_plot: false }
      let layout = {}
```
[2.8862]
[2.8921]
```
    let has_plot = { has_plot: false }
    let layout = {}
```

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 346 [2.42]

B:BD[2.8922] → [4.10233:10494]

  function relayout_(event: Plotly.PlotRelayoutEvent) {
      console.log('relayout_')
      const plot = document.getElementById('plot')!
      relayout(event, plot, Plotly, layout, has_plot, {
          prod: get(soleil),
          conso: somme,
      })
  }

[2.8922]

[2.9149]

    function relayout_(event: Plotly.PlotRelayoutEvent) {
        console.log('relayout_')
        const plot = document.getElementById('plot')!
        relayout(event, plot, Plotly, layout, has_plot, {
            prod: get(soleil),
            conso: somme,
        })
    }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 355 [2.42]

B:BD[2.9150] → [4.10495:11805]

  function redraw() {
      console.log('redraw')
      const plot = document.getElementById('plot')
      if (!plot) return
      let soleil_ = get(soleil)
      chooseScale(soleil_)
      chooseScale(somme)
      let unite: string
      if (soleil_.bucket == 24) {
          unite = 'kWh/jour'
      } else if (soleil_.bucket == 24 * 7) {
          unite = 'kWh/semaine'
      } else {
          unite = 'kWh'
      }
      layout = {
          title: 'Autoconsommation',
          autosize: true,
          automargin: true,
          plot_bgcolor: '#fff0',
          paper_bgcolor: '#fff0',
          font: {
              color: darkMode ? '#fff' : '#000',
          },
          xaxis: {
              gridcolor: darkMode ? '#444' : '#bbb',
              ticklabeloverflow: 'allow',
              ticklabelstep: 4,
              tickangle: 45,
              tickformat: soleil_.bucket < 24 ? '%x %X' : '%x',
              type: 'datetime',
          },
          yaxis: {
              title: { text: unite },
              gridcolor: darkMode ? '#444' : '#bbb',
              color: darkMode ? '#fff' : '#000',
          },
          showlegend: true,
          legend: {
              xanchor: 'center',
              x: 0.5,
              y: -0.4,
              orientation: 'h',
          },
      }

[2.9150]

[2.10550]

    function redraw() {
        console.log('redraw')
        const plot = document.getElementById('plot')
        if (!plot) return
        let soleil_ = get(soleil)
        chooseScale(plot, soleil_)
        chooseScale(plot, somme)
        let unite: string
        if (soleil_.bucket == 24) {
            unite = 'kWh/jour'
        } else if (soleil_.bucket == 24 * 7) {
            unite = 'kWh/semaine'
        } else {
            unite = 'kWh'
        }
        layout = {
            title: 'Autoconsommation',
            autosize: true,
            automargin: true,
            plot_bgcolor: '#fff0',
            paper_bgcolor: '#fff0',
            font: {
                color: darkMode ? '#fff' : '#000',
            },
            xaxis: {
                gridcolor: darkMode ? '#444' : '#bbb',
                ticklabeloverflow: 'allow',
                ticklabelstep: 4,
                tickangle: 45,
                tickformat: soleil_.bucket < 24 ? '%x %X' : '%x',
                type: 'datetime',
            },
            yaxis: {
                title: { text: unite },
                gridcolor: darkMode ? '#444' : '#bbb',
                color: darkMode ? '#fff' : '#000',
            },
            showlegend: true,
            legend: {
                xanchor: 'center',
                x: 0.5,
                y: -0.4,
                orientation: 'h',
            },
        }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 401 [2.42]

B:BD[2.10551] → [4.11806:12402]

      if (has_plot.has_plot) {
          console.log('has plot')
          //@ts-expect-error Plotly+typescript = meh
          Plotly!.update(plot, [soleil, somme], layout)
      } else {
          console.log("doesn't have plot")
          //@ts-expect-error Plotly+typescript = meh
          Plotly!.newPlot(plot, [soleil_, somme], layout, {
              responsive: true,
              modeBarButtonsToRemove: modeBarButtonsToRemove,
          })
          //@ts-expect-error Plotly+typescript = meh
          plot.on('plotly_relayout', relayout_)
          has_plot.has_plot = true
      }

[2.10551]

[2.10932]

        if (has_plot.has_plot) {
            console.log('has plot')
            //@ts-expect-error Plotly+typescript = meh
            Plotly!.update(plot, [soleil, somme], layout)
        } else {
            console.log("doesn't have plot")
            //@ts-expect-error Plotly+typescript = meh
            Plotly!.newPlot(plot, [soleil_, somme], layout, {
                responsive: true,
                modeBarButtonsToRemove: modeBarButtonsToRemove,
            })
            //@ts-expect-error Plotly+typescript = meh
            plot.on('plotly_relayout', relayout_)
            has_plot.has_plot = true
        }

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 417 [2.42]

B:BD[2.10933] → [4.12403:12724]

      var dataProd = [
          {
              values: [Math.round(auto), Math.round(totalProd - auto)],
              labels: ['Autoconsommé', 'Surplus'],
              marker: { colors: ['#ffbf00dd', '#b81111dd'] },
              type: 'pie',
              sort: false,
              hole: 0.5,
          },
      ]

[2.10933]

[2.11274]

        var dataProd = [
            {
                values: [Math.round(auto), Math.round(totalProd - auto)],
                labels: ['Autoconsommé', 'Surplus'],
                marker: { colors: ['#ffbf00dd', '#b81111dd'] },
                type: 'pie',
                sort: false,
                hole: 0.5,
            },
        ]

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 428 [2.42]

B:BD[2.11275] → [4.12725:13050]

      var dataConso = [
          {
              values: [Math.round(auto), Math.round(totalConso - auto)],
              labels: ['Autoproduit', 'Fournisseur'],
              marker: { colors: ['#ffbf00dd', '#b81111dd'] },
              type: 'pie',
              sort: false,
              hole: 0.5,
          },
      ]

[2.11275]

[2.11620]

        var dataConso = [
            {
                values: [Math.round(auto), Math.round(totalConso - auto)],
                labels: ['Autoproduit', 'Fournisseur'],
                marker: { colors: ['#ffbf00dd', '#b81111dd'] },
                type: 'pie',
                sort: false,
                hole: 0.5,
            },
        ]

Replacement in src/routes/grain/projet/[id]/simulation/Simulation.svelte at line 439 [2.42]

B:BD[2.11621] → [4.13051:14411]

      if (totalProd && totalConso) {
          plotStyle = 'min-height:450px'
          Plotly.react(
              'autoProd',
              //@ts-expect-error Plotly+typescript = meh
              dataProd,
              {
                  title: "Autoconsommation sur l'année",
                  font: {
                      color: darkMode ? '#fff' : '#000',
                  },
                  plot_bgcolor: '#fff0',
                  paper_bgcolor: '#fff0',
                  autosize: true,
                  automargin: true,
                  legend: {
                      orientation: 'h',
                  },
              },
              { responsive: true }
          )
          Plotly.react(
              'autoConso',
              //@ts-expect-error Plotly+typescript = meh
              dataConso,
              {
                  title: "Autoproduction sur l'année",
                  font: {
                      color: darkMode ? '#fff' : '#000',
                  },
                  plot_bgcolor: '#fff0',
                  paper_bgcolor: '#fff0',
                  autosize: true,
                  automargin: true,
                  legend: {
                      orientation: 'h',
                  },
              },
              { responsive: true }
          )
      } else {
          plotStyle = ''
      }
  }

[2.11621]

[2.12951]

        if (totalProd && totalConso) {
            plotStyle = 'min-height:450px'
            Plotly.react(
                'autoProd',
                //@ts-expect-error Plotly+typescript = meh
                dataProd,
                {
                    title: "Autoconsommation sur l'année",
                    font: {
                        color: darkMode ? '#fff' : '#000',
                    },
                    plot_bgcolor: '#fff0',
                    paper_bgcolor: '#fff0',
                    autosize: true,
                    automargin: true,
                    legend: {
                        orientation: 'h',
                    },
                },
                { responsive: true }
            )
            Plotly.react(
                'autoConso',
                //@ts-expect-error Plotly+typescript = meh
                dataConso,
                {
                    title: "Autoproduction sur l'année",
                    font: {
                        color: darkMode ? '#fff' : '#000',
                    },
                    plot_bgcolor: '#fff0',
                    paper_bgcolor: '#fff0',
                    autosize: true,
                    automargin: true,
                    legend: {
                        orientation: 'h',
                    },
                },
                { responsive: true }
            )
        } else {
            plotStyle = ''
        }
    }