title: Draw a Line with Thick Base and Thin Top -Speedometer Needle
body: <p>I am having a problem: I need to draw a Needle over a Speedometer. I am using simple Line Function in JS that draws a line/Needle. I want my Needle to be thick from base and thin from tip as shown below. Please advise how to draw such needle in JavaScript. The Desired and Current Needles are below.</p>
  
  <p>Code of Line:</p>
  
  <pre><code>function drawNeedle(options) {
  /* Draw the needle  at the
  * angle that represents the options.speed value.
  */
  
  var iSpeedAsAngle = convertSpeedToAngle(options),
      iSpeedAsAngleRad = degToRad(iSpeedAsAngle),
      gaugeOptions = options.gaugeOptions,
      innerTickX = gaugeOptions.radius - (Math.cos(iSpeedAsAngleRad) * 10),
      innerTickY = gaugeOptions.radius - (Math.sin(iSpeedAsAngleRad) * 10),
      fromX = (options.center.X - gaugeOptions.radius) + innerTickX,//+ innerTickX ,// /2,
      fromY = (gaugeOptions.center.Y - gaugeOptions.radius) + innerTickY ,//+ innerTickY, // /2,
      endNeedleX = gaugeOptions.radius - (Math.cos(iSpeedAsAngleRad) * gaugeOptions.radius),//+40,
      endNeedleY = gaugeOptions.radius - (Math.sin(iSpeedAsAngleRad) * gaugeOptions.radius),//+60, // controlled height of nedle
      toX = (options.center.X - gaugeOptions.radius) + endNeedleX,
      toY = (gaugeOptions.center.Y - gaugeOptions.radius) + endNeedleY,
  
     line = createLine(options.center.X + 80, options.center.Y + 60, toX+75, toY+60, "rgb(3,2,245)", 5, 0.6);  //80.60.75.65
  
  // line = createLine(fromX, fromY, toX, toY, "rgb(3,2,245)", 5, 0.6);
  
  drawLine(options, line);
  </code></pre>
  
  <p>}</p>
  
  <p><strong>drawLine Function</strong></p>
  
  <pre><code>function drawLine(options, line) {
  
  // Draw a line using the line object passed in
  options.ctx.beginPath();
  
  // Set attributes of open
  options.ctx.globalAlpha = line.alpha;
  options.ctx.lineWidth = line.lineWidth;
  options.ctx.fillStyle = line.fillStyle;
  options.ctx.strokeStyle = line.fillStyle;
  options.ctx.moveTo(line.from.X,
      line.from.Y);
  
  // Plot the line
  options.ctx.lineTo(
      (line.to.X),
      line.to.Y
  );
  
  options.ctx.stroke();
  </code></pre>
  
  <p>}</p>
  
  <p><a href="https://i.stack.imgur.com/q2MRZ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/q2MRZ.png" alt="The Desired and Current Needles"></a></p>