Closed vhakulinen closed 7 years ago
Couldn't confirm on chrome (because it just crashed), but on firefox, this is what I managed to get (from the compiled javasccript using map file)
function drawRadialMinorTicks(context, options) { var radius = radialTicksRadius(context, options); var s = void 0, range = void 0, angle = void 0; var i = 0; var delta = 0; var ratio = options.ticksAngle / (options.maxValue - options.minValue); context.lineWidth = SmartCanvas.pixelRatio; context.strokeStyle = options.colorMinorTicks; context.save(); if (options.exactTicks) { range = options.maxValue - options.minValue; s = range / options.minorTicks; delta = options.majorTicks[0] % options.minorTicks * ratio; } else { s = options.minorTicks * (options.majorTicks.length - 1); } for (; i < s; ++i) { <-- here, s is (or should be) zero - firefox optimizes s away angle = options.startAngle + delta + i * (options.ticksAngle / s); context.rotate(drawings.radians(angle)); context.beginPath(); context.moveTo(0, radius); context.lineTo(0, radius - context.max * 0.075); closeStrokedPath(context); } }
Related config:
{ "renderTo": {}, "width": 201, "height": 200, "minValue": -7, "maxValue": 107, "value": 0, "units": false, "exactTicks": true, "majorTicks": [ -7, 0, 20, 80, 100, 107 ], "minorTicks": 0, "strokeTicks": true, "animatedValue": false, "animateOnInit": false, "title": false, "borders": true, "numbersMargin": 1, "valueInt": 3, "valueDec": 2, "majorTicksInt": 1, "majorTicksDec": 0, "animation": true, "animationDuration": 500, "animationRule": "cycle", "colorPlate": "#fff", "colorPlateEnd": "", "colorMajorTicks": "#444", "colorMinorTicks": "#666", "colorTitle": "#888", "colorUnits": "#888", "colorNumbers": "#444", "colorNeedle": "rgba(240,128,128,1)", "colorNeedleEnd": "rgba(255,160,122,.9)", "colorValueText": "#444", "colorValueTextShadow": "rgba(0,0,0,0.3)", "colorBorderShadow": "rgba(0,0,0,0.5)", "colorBorderOuter": "#ddd", "colorBorderOuterEnd": "#aaa", "colorBorderMiddle": "#eee", "colorBorderMiddleEnd": "#f0f0f0", "colorBorderInner": "#fafafa", "colorBorderInnerEnd": "#ccc", "colorValueBoxRect": "#888", "colorValueBoxRectEnd": "#666", "colorValueBoxBackground": "#babab2", "colorValueBoxShadow": "rgba(0,0,0,1)", "colorNeedleShadowUp": "rgba(2,255,255,0.2)", "colorNeedleShadowDown": "rgba(188,143,143,0.45)", "colorBarStroke": "#222", "colorBar": "#ccc", "colorBarProgress": "#888", "colorBarShadow": "#000", "fontNumbers": "Arial", "fontTitle": "Arial", "fontUnits": "Arial", "fontValue": "Arial", "fontNumbersSize": 20, "fontTitleSize": 24, "fontUnitsSize": 22, "fontValueSize": 26, "fontNumbersStyle": "normal", "fontTitleStyle": "normal", "fontUnitsStyle": "normal", "fontValueStyle": "normal", "fontNumbersWeight": "normal", "fontTitleWeight": "normal", "fontUnitsWeight": "normal", "fontValueWeight": "normal", "needle": true, "needleShadow": true, "needleType": "arrow", "needleStart": 5, "needleEnd": 85, "needleWidth": 4, "borderOuterWidth": 3, "borderMiddleWidth": 3, "borderInnerWidth": 3, "borderShadowWidth": 3, "valueBox": true, "valueBoxStroke": 5, "valueBoxWidth": 0, "valueText": "", "valueTextShadow": true, "valueBoxBorderRadius": 2.5, "highlights": [ { "from": -7, "to": 0, "color": "#FF0000" }, { "from": 0, "to": 20, "color": "#FFF000" }, { "from": 20, "to": 80, "color": "#00FF00" }, { "from": 80, "to": 100, "color": "#FFF000" }, { "from": 100, "to": 107, "color": "#FF0000" } ], "highlightsWidth": 15, "barWidth": 0, "barStrokeWidth": 0, "barProgress": true, "barShadow": 0, "ticksAngle": 270, "startAngle": 45, "colorNeedleCircleOuter": "#f0f0f0", "colorNeedleCircleOuterEnd": "#ccc", "colorNeedleCircleInner": "#e8e8e8", "colorNeedleCircleInnerEnd": "#f5f5f5", "needleCircleSize": 10, "needleCircleInner": true, "needleCircleOuter": true, "animationTarget": "needle", "useMinPath": false, }
EDIT: Working workaround is to set minorticks to same as minValue -1
Fixed in branch v2.1.1 Test URL: https://rawgit.com/Mikhus/canvas-gauges/v2.1.2/examples/issue-99.html
Couldn't confirm on chrome (because it just crashed), but on firefox, this is what I managed to get (from the compiled javasccript using map file)
Related config:
EDIT: Working workaround is to set minorticks to same as
minValue-1