raphael js, calculate setViewBox width height to fix window

Question

My div content canvas in first width : 1300, height = 500

Then I resize div to width = 800, height = 500

And I resize canvas to width = 800, height = 500 to fix window

But Some Elements in canvas is hide (because My canvas width now is 800px)

So I use setViewBox to zoom it to fix width my new width, height

Result: mouse not fix with element when I drag them (I think I calculate wrong width-height for setViewBox)

Other question: Have any way to let canvas height auto extend when drag element down?

Thanks for help :)

Answer 1

try this code (you have to include jquery + raphael js 2.x) :

var original_width = 777;
var original_height = 667;
var zoom_width = map_width*100/original_width/100;
var zoom_height = map_height*100/original_height/100;
if(zoom_width<=zoom_height)
   zoom = zoom_width;
else
   zoom = zoom_height;
rsr.setViewBox($("#"+map_name).offset().left, $("#"+map_name).offset().top, (map_width/zoom), (map_height/zoom));