Responsivel – PHP Charts & Graphs https://phpchart.com Making charts in PHP is simple again. Mon, 11 May 2015 07:37:10 +0000 en-US hourly 1 https://wordpress.org/?v=5.8.13 Be Responsive! https://phpchart.com/examples/be-responsive/ https://phpchart.com/examples/be-responsive/#respond Mon, 23 Jun 2014 17:57:26 +0000 http://phpchart.org/?p=1124 With a little tricks with Javascript and CSS, the phpChart can be responsive. It stretches and shrinks based on the page width, perfect for mobile devices such as iOS and Android. The following code snippet works on any charts. Simply copy and paste them to the END of your page before </body> tag. CSS: 123456.jqplot-target{ […]

The post Be Responsive! appeared first on PHP Charts & Graphs.

]]>
With a little tricks with Javascript and CSS, the phpChart can be responsive. It stretches and shrinks based on the page width, perfect for mobile devices such as iOS and Android.

The following code snippet works on any charts. Simply copy and paste them to the END of your page before </body> tag.

CSS:

1
2
3
4
5
6
.jqplot-target{
    position: relative !important;
    width: auto !important;
    /* max-width: 1000px; */ /* OPTIONAL */
    min-width: 300px; /* OPTIONAL */
}

Javascript:

Please note that canvas object name is the chart id with underscore prefix. For instance, if id is “chart1”, then the javascript name is “_chart1”.

1
2
3
4
5
6
7
<script>// <![CDATA[
$(document).ready(function(){
    $(window).resize(function() {
        _chart1.replot( { resetAxes: true } );
    });
});
// ]]></script>

Live demo – Try resize the window using mouse!

The post Be Responsive! appeared first on PHP Charts & Graphs.

]]>
https://phpchart.com/examples/be-responsive/feed/ 0