0

I have the following JQ plot chart.

 plot1 = $.jqplot('chart1',[arr2],{
                axes:{
                    xaxis:{
                        renderer:$.jqplot.DateAxisRenderer,
                        tickRenderer: $.jqplot.CanvasAxisTickRenderer,
                        tickOptions:{formatString:'%d %b %Y'},

                    min:'Mar 01, 2013',
                        max: 'Jun 01, 2013',
                        tickInterval:'1 month',
                        numberTicks: '11',
                        label: 'Release Date',
                    },
                    yaxis:{
                        renderer:$.jqplot.LogAxisRenderer,
                        tickOptions:{showMark: true},
                        label: 'Media Buzz',
                        showGridline: true,
                        show: false,
                        //padMin: '0',
                        //padMax: '0',
                        min: '0.2',
                        max: '50',

                    }
                },
                cursor:{ 
                    show: true,
                    zoom:true, 
                    showTooltip:false,
                    constrainZoomTo: 'x',
                    showVerticalLine: true
                },
                seriesDefaults:{
                    renderer: $.jqplot.BubbleRenderer,
                    rendererOptions: {
                     autoscaleBubbles: false,
                    escapeHtml: false
                        },
                    shadow: true
                }
            }   

The issue is that when the array 'arr2' contains data points which fall outside the chart area , they are displayed off the grid (see image below). Is there a way to ensure that they are hidden?

Image 1

and the data in arr2 is:

["2013-02-27",30,10,"Events","Oscars"],
["2013-02-01",1.7730000000000001,10,"E1",‌​"Anti-viral",
{"budget":0,"genres": [
    {"id":9648,"name":"Mystery"},
    {"id":878,"name":‌​"Science Fiction"},
    {"id":53,"name":"Thriller"}
  ],
  "id":125490,
  "imdb_id":"tt2099556",
  "origin‌​al_title":"Antiviral",
  "overview":"...",
  "popularity":1.7730000000000001,
  "productio‌​n_companies":[],
  "production_countries":[],
  "release_date":"2012-10-12",
  "revenue":0‌​,
  "runtime":110,
  "spoken_languages":[
    {"iso_639_1":"en","name":"English"}
  ],
  "title":"‌​Antiviral",
  "vote_average":7.3,
  "vote_count":2
}]
Raad
  • 4,540
  • 2
  • 24
  • 41
AntonCooper
  • 73
  • 1
  • 8
  • I'm not convinced your value for `xaxis - max` is in the right format, so it might not be applying. could you show some values for data in `arr2`? – Raad Mar 15 '13 at 14:41
  • ["2013-02-27",30,10,"Events","Oscars"],["2013-02-01",1.7730000000000001,10,"E1","Anti-viral",{"budget":0,"genres":[{"id":9648,"name":"Mystery"},{"id":878,"name":"Science Fiction"},{"id":53,"name":"Thriller"}],"id":125490,"imdb_id":"tt2099556","original_title":"Antiviral","overview":"...","popularity":1.7730000000000001,"production_companies":[],"production_countries":[],"release_date":"2012-10-12","revenue":0,"runtime":110,"spoken_languages":[{"iso_639_1":"en","name":"English"}],"title":"Antiviral","vote_average":7.3,"vote_count":2}] – AntonCooper Mar 15 '13 at 14:49

1 Answers1

3

Ok I finally figured it out!

The problem was with bubble renderer. A quick CSS fix worked

.jqplot-series-canvas {overflow: hidden;} 
AntonCooper
  • 73
  • 1
  • 8