jquery - Javascript adjust div position after zoom -

-

i'm working on script there image on canvas. user can zoom on image mouse wheel (using d3js zoom), zoom centered mouse position.

my problem have div on canvas supposed highlight parts of image. div position should updated when zooming still highlight same spot. i'am struggling find way it. here's jsfiddle basic example, want div cover same spot of image when zooming.

code used zoom image: 

function zoom() {     var e = d3.event;     var tx = math.min(0, math.max(e.translate[0], 408 - 408 * e.scale));     var ty = math.min(0, math.max(e.translate[1], 464 - 464 * e.scale));     context.save();     context.clearrect(0, 0, 408, 464);     zoome.translate([tx, ty]);     context.translate(tx, ty);     context.scale(d3.event.scale, d3.event.scale);     context.drawimage(imageobj, 0, 0, 408, 464);     context.restore(); }

thanks.


Comments

Post a Comment

Popular posts from this blog

Lists in Python -

-
i noticed can multiply list scalar behavior weird if multiply: [2,3,4] * 3 i get: [2,3,4,2,3,4,2,3,4 ] understand results it's for? there other weird operations that? the main purpose of operand initialisation. example, if want initialize list 20 equal numbers can using loop: arr=[] in range(20): arr.append(3) an alternative way using operator: arr = [3] * 20 more weird , normal list operation on lists can find here http://www.discoversdk.com/knowledge-base/using-lists-in-python
Read more

android - can not access to progress bar in an other activity -

-
i have objects in layout video view,text view , on comes this: <?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.cardview android:id="@+id/cardview_mypost" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginbottom="@dimen/activity_vertical_margin" app:cardcornerradius="@dimen/activity_vertical_margin" app:cardelevation="@dimen/activity_vertical_margin" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto"> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:background="@color/web_withe_color" android:animatelayoutchanges="@anim/anim_list" android:padding="8dp" > <!-- thu...
Read more

html - Not able to access next element of an array javascript -

-
i new js, trying access next element of array using onclick function no luck. var i, len; function quiz() { var quiz_questions = [ "who founder of facebook?", "who founder of google?" ]; len = quiz_questions.length; for(i = 0; < len; i++) { document.getelementbyid("demo").innerhtml = quiz_questions[i]; } } <button onclick="quiz();">click</button> <p id="demo"></p> can explain me did wrong here. your problem is, iterate through every question, every time click. remove loop , put i++ after setting question. maybe checking, if less array length before it, wouldnt bad idea. var i, len; = 0; function quiz() { var quiz_questions = [ "who founder of facebook?", "who founder of google?" ]; len = quiz_questions.length; document.gete...
Read more