Question

Quelqu'un sait-il d'une façon de créer automatiquement un graphique SVG et exporter une version d'image JPEG ou PNG du tableau Highacarts en même temps (de préférence sur $(document).ready)?

Je veux afficher la version SVG à l'écran et de mettre dans un DIV caché pour l'impression du PNG ou JPEG.

Merci à l'avance.

Était-ce utile?

La solution

Ma solution crée automatiquement une image équivalente du SVG de chaque tableau dans ma page / tableau de bord (dans son état de départ), sans la nécessité d'un utilisateur de les exporter individuellement. Cela permet à tous les graphiques de Highcharts et graphiques sur une page pour imprimer correctement, sans interaction de l'utilisateur est nécessaire.

La raison pour que les pages avec des graphiques de Highcharts ne sont pas imprimées correctement parce que les cartes sont faites en utilisant SVG et les versions actuelles des navigateurs les plus courants ne supportent pas l'impression SVG (écrit janvier 2012). Ma solution sera donc hors de propos quand ils le font.

Ma solution contourne cette limitation du navigateur:

Tout d'abord, je modifie le fichier exporting.js Highcharts afin de déclencher automatiquement la routine qui est généralement déclenché lorsque l'utilisateur choisit manuellement pour exporter une image.

Ensuite, il est important de noter que lorsqu'un utilisateur choisit manuellement pour exporter une image de leur demande est envoyée comme une demande d'en-tête de la page d'ensemble.

Par conséquent, mon amendement à la fonction d'exportation ne POST pas les données Highcharts directement, mais d'abord les données SVG POTEAUX et autres nécessaires qui Highcharts a besoin de DIVs dans ma page / tableau de bord.

Chaque DIV qui reçoit la demande comprend un fichier php dont json_encodes routine les données POST reçoit de la routine d'exportation, puis POTEAUX hors tension à Highcharts serveur d'exportation comme sa propre tête.

Alors, parce que le POST est déclenché à partir de cette DIV, le résultat est renvoyé directement à cette DIV, comme en-tête du script PHP dans ce DIV.

Une fois qu'il a été renvoyé à cette DIV j'ai sauvé l'image, a fait l'impression DIV uniquement via CSS et la seule sortie HTML de cette DIV était la balise img avec le chemin du fichier d'image.

a déclenché l'ensemble des divs à être peuplée avec leurs images à l'aide $(document).ready.

Une note à quelqu'un d'autre d'essayer ce que la configuration de mon dev et serveur en différé, ce qui signifie que je devais stripslashes JSON sur l'un d'eux avant de l'envoyer à Highcharts.

Les postes suivants pointeront quelqu'un d'autre d'essayer de le faire dans la bonne direction.

Sauver une image Google graphique pour fichier en utilisant PHP

Affichage à un DIV:

formulaire Poster sur JQuery et Peupler DIV - cassé dans IE

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top