Freehand Drawing: Create Routes with Your Finger

Learn how to use TrailNote's innovative freehand drawing feature to create custom routes by drawing directly on the map.
Published on January 20, 2025
Freehand drawing allows you to create custom routes by drawing directly on the map with your mouse or finger. This feature is perfect for:
  • Walking paths: Trace the exact path you took through a park or city
  • Scenic routes: Draw winding roads through mountains or countryside
  • Custom trails: Create unique hiking or biking routes
  • Irregular paths: Capture routes that don't follow standard roads
Access the Drawing Tool
Look for the brush icon in the map controls. The tooltip will show "Freehand Draw (Beta)".
Freehand drawing button location in map controlsThe brush icon in the map controls - click to enter freehand drawing mode
Enter Drawing Mode
Click the brush button to enter freehand drawing mode. The button will turn blue and your cursor will change to a crosshair (+) to indicate you're in drawing mode.
Draw Your Route
Click and drag on the map to draw your route:
  • Press and hold the mouse button (or touch and hold on mobile)
  • Drag to draw your path - you'll see a dashed line following your movement
  • Release the mouse button (or lift your finger) to complete the route
Example of drawing a route line on the mapExample of drawing a custom route - the dashed line shows your drawing in progress
Automatic Save
When you finish drawing, TrailNote automatically:
  • Calculates the total distance of your route
  • Applies your default route color and style settings
  • Saves the route to your project with a timestamp name
  • Shows a success message

✅ Best Practices

  • Draw smoothly: Move your mouse/finger in steady, continuous motions
  • Zoom in first: Zoom into your area for more precise drawing
  • Use appropriate speed: Don't draw too fast - moderate speed works best
  • Check your route: The dashed preview line shows exactly what you're drawing

⚠️ Things to Avoid

  • Very short routes: Routes need at least 2 points to be saved
  • Drawing too fast: This might result in jagged or incomplete lines
  • Forgetting to exit: Click the brush button again to exit drawing mode
The freehand drawing feature uses advanced web technologies to provide a smooth drawing experience:
  • Real-time tracking: Mouse/touch movements are captured in real-time
  • Automatic smoothing: The system automatically smooths your drawn path
  • Distance calculation: Uses precise geographic calculations for accurate distances
  • Style inheritance: Automatically applies your preferred route colors and settings
Once you've created a freehand route, you can manage it just like any other route:
  • Rename: Click on the route to open the info panel and edit the name
  • Add description: Add notes about your route in the description field
  • Change style: Modify colors, width, and opacity in the route settings
  • Mark as visited: Update the status when you've completed the route
  • Delete: Remove routes you no longer need