1995parham / react-canvas-gauges

React Canvas Gauges Component based on Canvas gauges
GNU General Public License v3.0
29 stars 20 forks source link

Getting error when using linear gauge #5

Open abhishekginani-tm opened 6 years ago

abhishekginani-tm commented 6 years ago

Error : DOMException: Failed to execute 'arc' on 'CanvasRenderingContext2D': The radius provided (-3) is negative.

Script:

import {RadialGauge,LinearGauge} from 'react-canvas-gauges';

<LinearGauge
    Width="120"
    Height="400"
    Units="°C"
    MinValue="0"
    StartAngle="90"
    TicksAngle="180"
    ValueBox="false"
    MaxValue="220"
    MajorTicks="0,20,40,60,80,100,120,140,160,180,200,220"
    MinorTicks="2"
    StrokeTicks="true"
    Highlights='[ {"from": 100, "to": 220, "color": "rgba(200, 50, 50, .75)"} ]'
    ColorPlate="#fff"
    BorderShadowWidth="0"
    Borders="false"
    NeedleType="arrow"
    NeedleWidth="2"
    NeedleCircleSize="7"
    NeedleCircleOuter="true"
    NeedleCircleInner="false"
    AnimationDuration="1500"
    AnimationRule="linear"
    BarWidth="10"
    Value="35"
/>