#reactjs #kendo-ui #jsgauge #kendo-gauge
Вопрос:
Я пытаюсь изменить указатель в RadialGauge Kendo UI, но я не вижу возможности сделать это в файле jsx.
Это то, чего я пытаюсь достичь-
Обратите внимание на форму черного указателя. Это больше похоже на форму капли.
Вот как выглядит мой датчик на данный момент-
Обратите внимание на черный кружок в нижней части указателя. Я хотел бы иметь возможность уменьшить его радиус.
Ниже приведен мой код — https://stackblitz.com/edit/react-zqkayk?file=app/main.jsx
const radialOptions = {
pointer: {
type: "needle",
value: ValueVar,
color: 'black',
cap: {
size: 0.1
}
},
shape: 'arrow',
scale: {
max: 100,
startAngle: 0,
endAngle: 180,
rangeSize:10,
labels: { visible: false },
majorTicks: { visible: false },
minorTicks: { visible: false },
ranges: RangesVar
}
};
return <RadialGauge {...radialOptions} />;
Я заметил из инструментов разработчика, что это компонент «круг» в классе «k-калибр». и у него есть свойство под названием «r», которое определяет радиус. И если я уменьшу его до «7,7», я уменьшу его.
Но я не уверен, как на это нацелиться.
Комментарии:
1. Вы пробовали изменить
pointer.cap.size
это ? Скажем0.01
, например?2. Да @jpllosa , снятие фаски с колпачка.размер повлияет на толщину указателя, а не только на окружность.