Jump to content
JChartFX Community

Sandy

Members
  • Posts

    1
  • Joined

  • Last visited

Posts posted by Sandy

  1.  Hi

    I am trying to make JChartFx responsive as below in Window Resize event but it is not working(I am trying in Firefox browser). Could somebody help me on this.

     $(window).resize(function (e) {
            var viewportWidth = $(window).width();
            var viewportHeight = $(window).height();
            
            if (viewportWidth < 800) {            
                $('#divChartPeopleJoined').css("width", "200px");
                var c = $('.classcontainingChart').find('.jchartfx');
                $©.each(function (i, chart) {                
                    chart._ud(true);
                });
            }
            else {
                $('#divChartPeopleJoined').css("width", "600px");
                var c = $('.classcontainingChart').find('.jchartfx');
                $©.each(function (i, chart) {                
                    chart._ud(true);
                });
            }
        });

     Here is my div..

    <div id="ChartPeopleJoined" style="width: 600px; height: 300px; display: inline-block"></div>

    and here is my chart code..

    var chart1;

                chart1 = new cfx.Chart();
                chart1.getAnimations().getLoad().setEnabled(true);

                chart1.setGallery(cfx.Gallery.Area);
                chart1.setBorder(null);
                chart1._ud(true);

                chart1.getAxisX().setVisible(false);
                chart1.getAxisY().setVisible(false);

                chart1.getDataGrid().setVisible(false);
                chart1.getLegendBox().setDock(cfx.DockArea.Top);
                chart1.getLegendBox().setVisible(false);

                var allSeries = chart1.getAllSeries();
                allSeries.setMarkerShape(cfx.MarkerShape.Rect);

                var ChartPeopleJoined = document.getElementById('ChartPeopleJoined');
                chart1.create(ChartPeopleJoined);

     

    Thanks

    Sandeep Kumar

×
×
  • Create New...