Plotly er et utmerket plottingsverktøy som omfattende støtter de forskjellige tomtene og bruker tilfeller. I tillegg støtter det betydelige språk, som Python, R, JavaScript og mer.

I denne opplæringen vil vi fokusere på å bruke nedlastingimage () -funksjonen fra plottly.JS, som lar oss laste ned et bilde av en plottplott.

Installere plotly

Det første trinnet er å sikre at du har plottet.JS installert og kjører på systemet ditt. Du kan enten inkludere filen som en CDN eller installere den via NPM.

For enkelhets skyld vil vi inkludere Plotly-JS-pakken som CDN. Dette lar oss unngå å installere og laste ned node.JS og NPM.

Imidlertid, hvis du har installert node, kan du kjøre følgende kommando for å installere plotly.JS i prosjektet ditt.

Når vi er installert, kan vi gå videre og bruke den i prosjektene våre.

Grunnleggende søylediagram

Neste trinn er å forberede plottet vi ønsker å lage. For vårt eksempel vil vi bruke et søylediagram.

Start med å lage en indeks.HTML -fil. Dette vil omfatte all koden for dataene og typen tomter vi ønsker å utføre.

I indeksen.HTML -fil, legg til koden som vist nedenfor:

Plotly bar plot

Plottbar bar

Vi starter med å inkludere standard HTML -kjele -kode i forrige eksempel. Deretter har vi den plottly JS som en CDN ved hjelp av skriptetoden.

Til slutt opprettet vi tre HTML -elementer for å dekorere siden. Først må du sørge for å inkludere DIV med din spesifikke ID. Plottly vil bruke dette divelementet til å vise plottet som vist på plottet.newplot () funksjon.

Vi kan deretter åpne indeksen.HTML -fil i nettleseren vår og se plottet som vist nedenfor:

Plottly DownloadImage ()

Last ned () -funksjonen lar deg utløse en nedlasting av et spesifikt plot.

Funksjonen godtar navnet på plottet du ønsker å laste ned, formatet, bredden, høyden og filnavnet som parametere.

Syntaksen kan uttrykkes som vist nedenfor:

Plotly.nedlastingimage (plot_name, format: 'png', bredde: 800, høyde: 600, filnavn: 'newplot');

Bytt gjerne ut navnene med målverdiene dine.

I vårt eksempel Bar Plot gitt, kan vi bruke den daværende funksjonen i JavaScript for å laste ned nedlastingimage () bildefunksjon.

Plotly.newplot ("plotly_div", data, layout).deretter (funksjon (last ned)
Plotly.nedlasting (nedlasting,
Format: 'JPEG',
Høyde: 800,
Bredde: 1200,
filnavn: 'plot'
)
);

Når vi kjører indeksen.HTML -fil, nettleseren skal vise bildet og laste ned bildet med de spesifiserte parametrene.

Den resulterende filen vises nedenfor:

Funksjonen godtar følgende bildeformater når du eksporterer et bilde:

1. Png
2. JPEG
3. Webp
4. Svg
5. full-json

Eksempel 2

For å laste ned et bilde i JSON-format, angi formatet som “Full-JSON” som vist:

Plotly.newplot ("plotly_div", data, layout).deretter (funksjon (last ned)
Plotly.nedlasting (nedlasting,
Format: 'full-json',
Høyde: 800,
Bredde: 1200,
filnavn: 'plot'
)
);

Den forrige koden skal returnere en JSON -fil med alle egenskapene til den spesifiserte plottet.

Konklusjon

I denne opplæringen dekket vi hvordan du bruker nedlastingimage () -funksjonen i plottly.JS for å laste ned bildet av et plot. Flere eksempler ble gitt som viste bruken av det grunnleggende stolpediagrammet før du brukte funksjonen for å drive nedlastingimage ().