Generate image when google lib not response #786

Author: girishpanchal30

classes/Visualizer/Module/Chart.php

@@ -1443,18 +1443,18 @@ public function save_chart_image( $base64_img, $chart_id ) {
 		$file_type       = 'image/png';
 		$hashed_filename = $filename;
 
-		// Save the image in the uploads directory.
-		require_once ABSPATH . '/wp-admin/includes/file.php';
-		\WP_Filesystem();
-		global $wp_filesystem;
-		$upload_file = $wp_filesystem->put_contents( $upload_path . $hashed_filename, $decoded );
-
 		// Delete old chart image.
 		$old_attachment_id = get_post_meta( $chart_id, Visualizer_Plugin::CF_CHART_IMAGE, true );
 		if ( $old_attachment_id ) {
 			wp_delete_attachment( $old_attachment_id, true );
 		}
 
+		// Save the image in the uploads directory.
+		require_once ABSPATH . '/wp-admin/includes/file.php';
+		\WP_Filesystem();
+		global $wp_filesystem;
+		$upload_file = $wp_filesystem->put_contents( $upload_path . $hashed_filename, $decoded );
+
 		// Insert new chart image.
 		$attachment = array(
 			'post_mime_type' => $file_type,

classes/Visualizer/Render/Sidebar/Google.php

@@ -101,11 +101,13 @@ protected function hooks() {
 	 */
 	function load_google_assets( $deps, $is_frontend ) {
 		wp_register_script( 'google-jsapi', '//www.gstatic.com/charts/loader.js', array(), null, true );
+		wp_register_script( 'dom-to-image', VISUALIZER_ABSURL . 'js/lib/dom-to-image.min.js', array(), null, true );
 		wp_register_script(
 			'visualizer-render-google-lib',
 			VISUALIZER_ABSURL . 'js/render-google.js',
 			array(
 				'google-jsapi',
+				'dom-to-image',
 			),
 			Visualizer_Plugin::VERSION,
 			true

js/lib/dom-to-image.min.js

@@ -317,7 +317,18 @@ var __visualizer_chart_images   = [];
                     $( '#chart-img' ).val( img );
                 }
             }catch(error){
-                console.warn('render.getImageURI not defined for ' + arr[0] + '-' + arr[1]);
+                var canvas = document.getElementById( 'canvas' );
+                domtoimage.toPng(canvas)
+                .then(function ( img ) {
+                    __visualizer_chart_images[ arr[0] + '-' + arr[1] ] = img;
+                    $('body').trigger('visualizer:render:chart', {id: arr[1], image: img});
+                    if ( $( '#chart-img' ).length ) {
+                        $( '#chart-img' ).val( img );
+                    }
+                })
+                .catch(function (error) {
+                  console.warn('render.getImageURI not defined for ' + arr[0] + '-' + arr[1]);
+                });
             }
         });