Create line in canvas word search game

Question

I created word search game in canvas. Now I want when user select character for determine word draw line for highlight that but this is my results:

Answer 1

Here's an example Word Search using rounded semi-transparent stokes for highlighting:

var canvas=document.getElementById("canvas");
var ctx=canvas.getContext("2d");
var cw=canvas.width;
var ch=canvas.height;
function reOffset(){
  var BB=canvas.getBoundingClientRect();
  offsetX=BB.left;
  offsetY=BB.top;        
}
var offsetX,offsetY;
reOffset();
window.onscroll=function(e){ reOffset(); }

var isDown=false;
var startX,startY,endX,endY;

var rows=7;
var cols=7;
var cellWidth=40;
var cellHeight=40;

var letters = ['g', 'b', 's', 'i', 'c', 'e', 'n', 'o', 'b', 'u', 'w', 'v', 'r', 'd', 'o', 'k', 'i', 't', 'o', 'n', 'd', 'd', 't', 'm', 'c', 't', 'a', 'a', 'h', 'a', 'p', 'y', 's', 'e', 'c', 'k', 'o', 'z', 'b', 'z', 'i', 'r', 'p', 't', 'a', 's', 't', 'e', 's'];

var solutions=[];
solutions.push({start:{col:0,row:0},end:{col:0,row:3},color:'gold',word:'butter',isSolved:false});
solutions.push({start:{col:1,row:0},end:{col:6,row:5},color:'purple',word:'good',isSolved:false});
solutions.push({start:{col:0,row:6},end:{col:6,row:0},color:'green',word:'popcorn',isSolved:false});
solutions.push({start:{col:1,row:6},end:{col:6,row:6},color:'blue',word:'tastes',isSolved:false});
solutions.push({start:{col:3,row:1},end:{col:0,row:4},color:'red',word:'with',isSolved:false});

ctx.lineCap = "round";
ctx.lineWidth=20;
ctx.font='14px verdana';
ctx.textAlign='center';
ctx.textBaseline='middle';

drawLetters(letters);

highlightSolvedWords();

function testSolution(){
  var col0=parseInt(startX/cellWidth);
  var row0=parseInt(startY/cellHeight);
  var col1=parseInt(endX/cellWidth);
  var row1=parseInt(endY/cellHeight);
  for(var i=0;i=0){
      solutions[index].isSolved=true;
      highlightWord(solutions[index]);
    }
  }
}

function highlightSolvedWords(){
  for(var i=0;i

body{ background-color: ivory; }
#canvas{border:1px solid red;}

MouseDown at start of word. MouseUp at end of word.
Find: Popcorn tastes good with butter