Forum Replies Created

Viewing 15 replies - 1 through 15 (of 15 total)
  • Hello @aleksandar,

    I’m currently testing the plugin still without issues.
    I’ll let you know if any bug occurs.
    Thank you for your kind support.

    Best wishes,
    Mauro

    Thank you @urkekg for your kind reply.

    I’m non in hurry, so I can wait the “Stock Quote” plugin update.

    I’m going to submit my email through your form. I will be very happy to test your plugin update.

    Best wishes,
    Mauro

    • This reply was modified 1 year, 11 months ago by mauro269.

    I agree with The-Dude…the “intro” title is not necessary at the beginning of articles. Please, give us an update with the possibility to remove this.
    Thanks 🙂

    Sorry mate for the delay. Here it is the “wpflot.php” file, the only one I’ve modified:

    <?php
    /*
    Plugin Name: WP Flot
    Plugin URI: http://www.youssouhaagsman.nl/wpflot/
    Description: Shortcodes for Flot
    Version: 0.2.2
    Author: Youssou Haagsman
    Author URI: http://www.youssouhaagsman.nl
    License: GPLv2
    */
    
    /*  Copyright 2015 Youssou Haagsman
    
        This program is free software; you can redistribute it and/or modify
        it under the terms of the GNU General Public License, version 2, as
        published by the Free Software Foundation.
    
        This program is distributed in the hope that it will be useful,
        but WITHOUT ANY WARRANTY; without even the implied warranty of
        MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
        GNU General Public License for more details.
    
        You should have received a copy of the GNU General Public License
        along with this program; if not, write to the Free Software
        Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
    */
    
    // Script
    
    load_plugin_textdomain('wpflot', false, basename( dirname( __FILE__ ) ) . '/languages' );
    
    function flot_scripts() {
    
    	$flot = get_post_meta( get_the_ID(), 'flot', true );
    
    	if($flot == 'yes' || is_home() || is_category() || is_tag() || is_archive()) {
    
    		wp_register_script('flot', plugins_url( 'js/jquery.flot.all.min.js', __FILE__ ) ,array('jquery'));
    
    		wp_enqueue_script('flot');
    
    		function legendstyle() {
    
    			$legendstyle = <<<STYLE
    <style type="text/css">
    .legend table {
    	width: auto;
    	border: 0px;
    }
    
    .legend tr {
    	border: 0px;
    }
    .legend td {
    	padding: 5px;
    	font-size: 12px;
    	border: 0px;
    }
    </style>
    STYLE;
    
    		echo $legendstyle;
    		}
    
    		add_action('wp_head', 'legendstyle');
    
    	}
    
    	}
    
    add_action('wp_enqueue_scripts', 'flot_scripts');
    
    // Shortcodes
    
    function linechart_shortcode( $atts, $content ) {
    	extract( shortcode_atts( array(
    		'name' => 'Chart',
    		'height' => '400px',
    		'width' => '100%',
    		'points' => 'true',
    		'fill' => 'false',
    		'steps' => 'false',
    		'maxx' => 'null',
    		'maxy' => 'null',
    		'minx' => 'null',
    		'miny' => 'null',
    		'percentage' => '', //on wordpress you can declare -> percentage="%" and it will show the % symbol on y-axis and hovering on a chart point
    		'legend' => 'true'
    	), $atts ) );
    
    	static $number = 0;
    	$number++;
    
    	$content = strip_tags($content);
    
    	if (get_post_meta( get_the_ID(), 'flot', true ) !== 'yes')
    	{
    	update_post_meta( get_the_ID(), 'flot', 'yes');
    	}
    
    	return <<<HTML
    	<div id="plotarea$number" style="height: {$height}; width: {$width};">
    	</div>
    	<script type="text/javascript">
    jQuery(document).ready(function($){
    	var dataseries$number = [
    		$content
    	];
    
    	var options$number = {
    			series: {
    				shadowSize: 0,
    				points: {
    					show: {$points},
    					radius: 5
    				},
    				lines: {
    					show: true,
    					fill: {$fill},
    					fillColor: { colors: [ { opacity: 0.6 }, { opacity: 0.3 } ] },
    					steps: {$steps},
    					lineWidth: 3
    				},
    			},
    			lines: {
                	fill: false,
                	color: ["#3c8dbc"]
              	},
    			legend: {
    				show: {$legend},
    				backgroundOpacity: 0.7
    			},
    			grid: {
    				hoverable: true,
    				borderColor: "#f3f3f3",
    				borderWidth: 3,
    				tickColor: "#f3f3f3"
    			},
    			yaxis: {
    				show: true,
                	tickFormatter: (function formatter(y, axis) { return y + "{$percentage}"}),
                	tickDecimals: 0,
    				min: {$miny},
    				max: {$maxy}
    			},
    			xaxis: {
    				show: true,
                	tickDecimals: 0,
    				min: {$minx},
    				max: {$maxx}
    			},
    	};
    
    	var plotarea$number = $("#plotarea$number");
    	var plot$number = $.plot( plotarea$number , dataseries$number, options$number ); 
    
    });
    
    //Initialize tooltip on hover
            $("<div class='tooltip-inner' id='line-chart-tooltip'></div>").css({
              position: "absolute",
              display: "none",
              opacity: 0.8
            }).appendTo("body");
            $("#plotarea$number").bind("plothover", function (event, pos, item) {
    
              if (item) {
                var x = item.datapoint[0].toFixed(2),
                        y = item.datapoint[1].toFixed(2);
    
                $("#line-chart-tooltip").html(item.series.label + " on " + Math.floor(x) + " is " + y + "{$percentage}")
                        .css({top: item.pageY + 15, left: item.pageX - 55})
                        .fadeIn(200);
              } else {
                $("#line-chart-tooltip").hide();
              }
    
            });
    
            /*
           * Custom Label formatter
           * ----------------------
           */
          function labelFormatter(label, series) {
            return "<div style='font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;'>"
                    + label
                    + "<br/>"
                    + Math.round(series.percent) + "%</div>";
          }
    
    </script>
    HTML;
    }	
    
    function barchart_shortcode( $atts, $content ) {
    	extract( shortcode_atts( array(
    		'name' => 'Chart',
    		'height' => '400px',
    		'width' => '100%',
    		'fill' => 'true',
    		'maxx' => 'null',
    		'maxy' => 'null',
    		'minx' => 'null',
    		'miny' => 'null',
    		'legend' => 'true',
    		'horizontal' => 'false'
    	), $atts ) );
    
    	static $number = 0;
    	$number++;
    
    	if (get_post_meta( get_the_ID(), 'flot', true ) !== 'yes')
    	{
    	update_post_meta( get_the_ID(), 'flot', 'yes');
    	}
    
    	$content = strip_tags($content);
    
    	return <<<HTML
    	<div id="bararea$number" style="height: {$height}; width: {$width};">
    	</div>
    	<script type="text/javascript">
    jQuery(document).ready(function($){
    	var bardataseries$number = [
    		$content
    	];
    
    	var baroptions$number = {
    			series: {
    				bars: {
    					show: true,
    					align: "center",
    					barWidth: 0.5,
    					horizontal: {$horizontal}
    				}
    			},
    			legend: {
    				show: {$legend},
    				backgroundOpacity: 0.7
    			},
    			grid: {
    				backgroundColor: null
    			},
    			yaxis: {
    				min: {$miny},
    				max: {$maxy}
    			},
    			xaxis: {
    				min: {$minx},
    				max: {$maxx}
    			},
    	};
    
    	var bararea$number = $("#bararea$number");
    	var barplot$number = $.plot( bararea$number , bardataseries$number, baroptions$number ); 
    
    });
    </script>
    HTML;
    }
    
    function piechart_shortcode( $atts, $content ) {
    	extract( shortcode_atts( array(
    		'name' => 'Chart',
    		'height' => '400px',
    		'width' => '100%',
    		'legend' => 'false',
    		'donut' => '0',
    		'combine' => '0'
    	), $atts ) );
    
    	static $number = 0;
    	$number++;
    
    	if (get_post_meta( get_the_ID(), 'flot', true ) !== 'yes')
    	{
    	update_post_meta( get_the_ID(), 'flot', 'yes');
    	}
    
    	$content = strip_tags($content);
    
    	$other = __('Other','wpflot');
    
    	return <<<HTML
    	<div id="piearea$number" style="height: {$height}; width: {$width};">
    	</div>
    	<script type="text/javascript">
    jQuery(document).ready(function($){
    	var pie_dataseries$number = [
    		$content
    	];
    
    	var options$number = {
    			series: {
    				pie: {
    					show: true,
    					innerRadius: {$donut},
    					combine: {
    						color: '#999',
    						threshold: {$combine},
    						label: '{$other}'
    					},
    				}
    			},
    			legend: {
    				show: {$legend},
    				backgroundOpacity: 0.7
    			},
    			grid: {
    				backgroundColor: null
    			}
    	};
    
    	var piearea$number = $("#piearea$number");
    	var pieplot$number = $.plot( piearea$number , pie_dataseries$number, options$number ); 
    
    });
    </script>
    HTML;
    }
    
    add_shortcode( 'linechart', 'linechart_shortcode' );
    add_shortcode( 'piechart', 'piechart_shortcode' );
    add_shortcode( 'barchart', 'barchart_shortcode' );
    
    add_action( 'admin_init', function() {
    	if ( ! function_exists( 'shortcode_ui_register_for_shortcode' ) ) {
    	/*	add_action( 'admin_notices', function(){
    			if ( current_user_can( 'activate_plugins' ) ) {
    				echo '<div class="error message"><p>__( 'It is recommended to enable Shortcake to make adding shortcodes easier.', 'wpflot' ),</p></div>';
    			}
    			}); */
    		return;
    	}
    	else {
    		shortcode_ui_register_for_shortcode(
    				'linechart',
    				array(
    					'label' => __( 'Linechart', 'wpflot' ),
    					'listItemImage' => 'dashicons-chart-line',
    					'inner_content' => array(
    						'label' => __( 'Data', 'wpflot' ),
    					),
    					'attrs' => array(
    						array(
    							'label' => __( 'Name', 'wpflot' ),
    							'attr'  => 'name',
    							'type'  => 'text',
    						),
    						array(
    							'label' => __( 'Height', 'wpflot' ),
    							'attr'  => 'height',
    							'type'  => 'text',
    								'meta' => array(
    								'placeholder' => '400px',
    							),
    
    						),
    						array(
    							'label' => __( 'Width', 'wpflot' ),
    							'attr'  => 'width',
    							'type'  => 'text',
    								'meta' => array(
    								'placeholder' => '100%',
    							),
    						),
    						array(
    							'label' => __( 'Points', 'wpflot' ),
    							'attr'  => 'points',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Fill', 'wpflot' ),
    							'attr'  => 'fill',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Steps', 'wpflot' ),
    							'attr'  => 'steps',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Legend', 'wpflot' ),
    							'attr'  => 'steps',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Maximum value X-axis', 'wpflot' ),
    							'attr'  => 'maxx',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Maximum value Y-axis', 'wpflot' ),
    							'attr'  => 'maxy',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Minimum value X-axis', 'wpflot' ),
    							'attr'  => 'minx',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Minimum value Y-axis', 'wpflot' ),
    							'attr'  => 'miny',
    							'type'  => 'number',
    						),
    					),
    				)
    			);
    
    			shortcode_ui_register_for_shortcode(
    				'barchart',
    				array(
    					'label' => __( 'Barchart', 'wpflot' ),
    					'listItemImage' => 'dashicons-chart-bar',
    					'inner_content' => array(
    						'label' => 'Data',
    					),
    					'attrs' => array(
    						array(
    							'label' => __( 'Height', 'wpflot' ),
    							'attr'  => 'height',
    							'type'  => 'text',
    							'meta' => array(
    								'placeholder' => '400px',
    							),
    						),
    						array(
    							'label' => __( 'Width', 'wpflot' ),
    							'attr'  => 'width',
    							'type'  => 'text',
    								'meta' => array(
    								'placeholder' => '100%',
    							),
    						),
    						array(
    							'label' => __( 'Horizontal', 'wpflot' ),
    							'attr'  => 'horizontal',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Legend', 'wpflot' ),
    							'attr'  => 'steps',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Maximum value X-axis', 'wpflot' ),
    							'attr'  => 'maxx',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Maximum value Y-axis', 'wpflot' ),
    							'attr'  => 'maxy',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Minimum value X-axis', 'wpflot' ),
    							'attr'  => 'minx',
    							'type'  => 'number',
    						),
    						array(
    							'label' => __( 'Minimum value Y-axis', 'wpflot' ),
    							'attr'  => 'miny',
    							'type'  => 'number',
    						),
    					),
    				)
    			);
    
    			shortcode_ui_register_for_shortcode(
    				'piechart',
    				array(
    
    					'label' => __( 'Piechart', 'wpflot' ),
    					'listItemImage' => 'dashicons-chart-pie',
    					'inner_content' => array('label' => __( 'Data', 'wpflot' )),
    					'attrs' => array(
    						array(
    							'label' => __( 'Height', 'wpflot' ),
    							'attr'  => 'height',
    							'type'  => 'text',
    								'meta' => array(
    								'placeholder' => '400px',
    							),
    						),
    						array(
    							'label' => __( 'Width', 'wpflot' ),
    							'attr'  => 'width',
    							'type'  => 'text',
    								'meta' => array(
    								'placeholder' => '100%',
    							),
    						),
    						array(
    							'label' => __( 'Legend', 'wpflot' ),
    							'attr'  => 'steps',
    							'type'  => 'checkbox',
    						),
    						array(
    							'label' => __( 'Doughnut hole', 'wpflot' ),
    							'attr'  => 'donut',
    							'type'  => 'number',
    								'meta' => array(
    								'placeholder' => '0',
    							),
    							'description' => __( 'The size of the doughnut hole, as a number between 0 and 1.', 'wpflot' )
    						),
    					),
    				)
    			);
    
    		}
    
    } );
    
    add_filter( 'no_texturize_shortcodes', 'wpf_no_wptexturize' );
    function wpf_no_wptexturize($shortcodes){
        $shortcodes = array('linechart', 'piechart', 'barchart');
        return $shortcodes;
    };
    
    ?>

    Hi, thanks for your reply. Could you introduce again that feature configurable in the settings panel? In this way anyone can decide what to do…Indeed I need that kind of title structure, so it could be great.
    Thanks for your support and willingness.

    Good morning,
    considering I’ve improved your plugin, can you update it officially? I’ve improved a little bit your code since what I’ve written yesterday. Let me know if you want that I send you the “wpflot.php” file. In that case, I need your contact or let me know if I can attach it here.

    Ok, I’ve found the solution by myself.

    The file to modify is the “wpflot.php” that you can find inside the “/wp-content/plugins/wp-flot” path.

    Substitute the code from line 109 to line 143 with the following:

    var options$number = {
    			series: {
    				shadowSize: 0,
    				points: {
    					show: {$points},
    					radius: 5
    				},
    				lines: {
    					show: true,
    					fill: {$fill},
    					fillColor: { colors: [ { opacity: 0.6 }, { opacity: 0.3 } ] },
    					steps: {$steps},
    					lineWidth: 3
    				},
    			},
    			lines: {
                	fill: false,
                	color: ["#3c8dbc"]
              	},
    			legend: {
    				show: {$legend},
    				backgroundOpacity: 0.7
    			},
    			grid: {
    				hoverable: true,
    				borderColor: "#f3f3f3",
    				borderWidth: 3,
    				tickColor: "#f3f3f3"
    			},
    			yaxis: {
    				show: true,
                	tickFormatter: (function formatter(y, axis) { return y + "%"}),
                	tickDecimals: 0,
    				min: {$miny},
    				max: {$maxy}
    			},
    			xaxis: {
    				show: true,
                	tickDecimals: 0,
    				min: {$minx},
    				max: {$maxx}
    			},
    	};
    
    	var plotarea$number = $("#plotarea$number");
    	var plot$number = $.plot( plotarea$number , dataseries$number, options$number ); 
    
    });
    
    //Initialize tooltip on hover
            $("<div class='tooltip-inner' id='line-chart-tooltip'></div>").css({
              position: "absolute",
              display: "none",
              opacity: 0.8
            }).appendTo("body");
            $("#plotarea$number").bind("plothover", function (event, pos, item) {
    
              if (item) {
                var x = item.datapoint[0].toFixed(2),
                        y = item.datapoint[1].toFixed(2);
    
                $("#line-chart-tooltip").html(item.series.label + " on " + Math.floor(x) + " is " + y + "%")
                        .css({top: item.pageY + 15, left: item.pageX - 55})
                        .fadeIn(200);
              } else {
                $("#line-chart-tooltip").hide();
              }
    
            });
    
            /*
           * Custom Label formatter
           * ----------------------
           */
          function labelFormatter(label, series) {
            return "<div style='font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;'>"
                    + label
                    + "<br/>"
                    + Math.round(series.percent) + "%</div>";
          }

    Save the file and upload it on your server, overwriting the old “wpflot.php”.

    That’s all.

    Hi, thanks for your reply. Yes, but how can I add the necessary script to the page?
    I’ve already written the script that is the following:

    var line_data1 = {
              label: 'ROE',
              data: [[1963, 43], [1959, 48], [1956, 50], [1952, 30]],
              color: "#3c8dbc"
            };
    
            $.plot("#roe", [line_data1], {
              grid: {
                hoverable: true,
                borderColor: "#f3f3f3",
                borderWidth: 3,
                tickColor: "#f3f3f3"
              },
              series: {
                shadowSize: 0,
                lines: {
                  show: true,
                  lineWidth: 3
                },
                points: {
                  show: true,
                  radius: 5
                }
              },
              lines: {
                fill: false,
                color: ["#3c8dbc"]
              },
              legend: {
              	show: false,
              },
              yaxis: {
                show: true,
                tickFormatter: (function formatter(y, axis) { return y + "%"}),
                tickDecimals: 0
                },
              xaxis: {
                show: true,
                tickDecimals: 0
              }
            });
            //Initialize tooltip on hover
            $("<div class='tooltip-inner' id='line-chart-tooltip'></div>").css({
              position: "absolute",
              display: "none",
              opacity: 0.8
            }).appendTo("body");
            $("#roe").bind("plothover", function (event, pos, item) {
    
              if (item) {
                var x = item.datapoint[0].toFixed(2),
                        y = item.datapoint[1].toFixed(2);
    
                $("#line-chart-tooltip").html(item.series.label + " on " + Math.floor(x) + " is " + y + "%")
                        .css({top: item.pageY + 15, left: item.pageX - 55})
                        .fadeIn(200);
              } else {
                $("#line-chart-tooltip").hide();
              }
    
            });
            /* END LINE CHART */
    
          });
    
          /*
           * Custom Label formatter
           * ----------------------
           */
          function labelFormatter(label, series) {
            return "<div style='font-size:13px; text-align:center; padding:2px; color: #fff; font-weight: 600;'>"
                    + label
                    + "<br/>"
                    + Math.round(series.percent) + "%</div>";
          }

    How can I insert this code in your plugin?
    Thanks for your support 🙂

    Just to be more precise, in the link below you can see what I have in this moment:

    http://s15.postimg.org/x2yhxy62j/Schermata_2015_03_03_alle_22_57_10.png

    Hello Tobias,
    sorry for the late reply but I was a little bit busy with my job during this week.
    Going back on the tablepress extension, are you thinking to develop it or it was an idea for a far future? 😀
    In any case, thanks again for your great support.
    Regards,

    Mauro

    Hello Tobias,
    thanks for your great support.
    Just one more thing…is there a way to personalize the color of negative/positive values?
    To be more clear, I would like to automatically assign a red color to negative values. If this future is not integrated in the plugin, do you think it could be interesting to introduce it?
    Thanks.
    Regards,

    Mauro

    Hello Tobias,
    when will be officially available the update? Because I’ve no test website and I’m online with my site. In any case, thanks for your reply 🙂

    Regards,

    Mauro

    Dear Tobias,
    thanks for your reply. I’ve paid you a coffee through your website. I know it’s not too much but it’s what I can afford in this moment.
    Thanks for your help and for your great product.
    Regards,

    Mauro

    No reply to this? 🙂
    Thanks

    Ah, ok. Thanks a lot James. I thought it was a problem of my wordpress settings.
    Thanks for your help.
    Regards.

Viewing 15 replies - 1 through 15 (of 15 total)