Telerik Forums
Kendo UI for Angular Forum
0 answers
17 views
Hello,

I'm using the Upload component and must replace all icons with custom ones. For unknown reasons, I can replace all icons except an icon inside the retry button.
Here is a link to Stackblitz for reference: https://stackblitz.com/edit/angular-zkwyqn?file=src%2Fapp%2Fapp.component.ts,src%2Fapp%2Fapp.module.ts

Could you help me with this problem, please?
Rita
Top achievements
Rank 2
Iron
Iron
 updated question on 09 May 2024
0 answers
21 views

Hi,

I have a chart with multiple lines with numerical values. I also have a navigator themed selection pane, which works fine by now.
I would like to have Dates in various formats (depending on the zoom in level of the navigation) on the x axis.

I chose a line chart as suggested (because of the date / time x axis) instead of a scatterLineChart.
Until now I store testing data in an array of Series like so:


    series: Series[] = [
        {
            name: 'Series 1',
            type: 'line',
            data: [
                3.907, 7.943, 7.848, 9.284, 9.263, 9.801, 3.89, 8.238, 9.552, 6.855,
            ],
            color: '#058dc7',
        },
        {
            type: 'line',
            name: 'Series 3',
            data: [
                4.743, 7.295, 7.175, 6.376, 8.153, 8.535, 5.247, -7.832, 4.3, 4.3,
            ],
            markers: { type: 'square' },
            color: '#50b432',
        },
        {
            name: 'Series 3',
            type: 'line',
            data: [
                5.743, 8.295, 8.175, 7.376, 9.153, 9.535, 6.247, 1.832, 5.3, 5.3,
            ],
            markers: { type: 'roundedRect', visible: false },
            color: '#ed561b',
        },
        {
            name: 'Series 4',
            type: 'line',
            data: [
                0.01, -0.375, 1.161, 0.684, 3.7, 3.269, 1.083, -5.127, 3.69, 2.995,
            ],
            markers: { visible: false },
            color: '#dddf00',
        },
        {
            name: 'Custom',
            type: 'line',
            data: [2, 1.2, 4, 2, 5, 6, -4, -6, -4, -6],
            markers: { visible: false },
            legendItem: {
                type: 'area',
                area: {
                    opacity: 0.5,
                },
                highlight: {
                    visible: false,
                },
            },
            color: '#24cbe5',
        },
    ];

I am not sure how to pinpoint timestamps to the specific values, by now I can only find suitable examples within scatterline charts where the timestamps are given within the data array separately like the following structure as example:


onst data = (): WeatherData[] =>
[
  {
    Timestamp: '2018-01-01T00:00:00.000',
    TMax: 3.3,
    TMin: -12,
    Wind: 5.5,
    Rain: 0
  },
  {
    Timestamp: '2018-01-02T00:00:00.000',
    TMax: 5.2,
    TMin: -10,
    Wind: 8.1,
    Rain: 0
  },
...
];

What would be the correct way to define data in a series consisting of value and timestamp tumples?
Seems simple, but I can't figure it out.

Best Regards,

FirestormHell

Leo
Top achievements
Rank 1
Iron
 asked on 08 May 2024
1 answer
17 views

Hi,

I am trying to evaluate the possibilities to have horizontal lines for thresholds, maximums, minimums etc.
On the net I found a somewhat old post regarding stripLines, but this does not seem to be supported anymore. I can't find something in the docs / API.

So what I found next are plotbands, but manly these seem to be more suitable for areas, not really for lines.
This leaves me with custom plotbands using the drawing API (see: https://www.telerik.com/kendo-angular-ui/components/charts/elements/plot-bands/#toc-custom-plot-bands).
But this seems a bit overkill for a simple horizontal line which from my perspective only needs very basic things like value, title and let's say some styling like color, opacity, line thickness and the likes...

So my question: Is there a simple way for horizontal lines that I am missing or is the custom plotband the way to go in this matter?

Best Regards,
FirestormHell

 

Yanmario
Telerik team
 answered on 08 May 2024
1 answer
18 views

I'm updating our angular app from angular v14 to v15 (and then 16 and 17...) and saw that I have to update also Kendo.

I've luckily learned that finally all kendo-ui packages now share the same version number for a release (which is a very good move) just to find out that this is true for the most packages but not all packages.

So @progress/kendo-drawing and @progress/kendo-licensing still uses the old individual versioning and all @progress/kendo-angular-XXX packages of v11.6.0 references @progress/kendo-drawing v^1.17.2 and @progress/kendo-licensing v^1.0.2

I understand that @progress/kendo-drawing and @progress/kendo-licensing are independent from angular but why is there still an inconsistent individual versioning outside the @progress/kendo-angular-XXX namespace and not also a consistent versioning in @progress/kendo-XXX?

 

Martin Bechev
Telerik team
 answered on 07 May 2024
0 answers
20 views

How can scroll to active tab position dynamically, it becomes the first tab display of selected active tab from backend then it should be display in first position.

 

Example: if i have dates tabStrip then current date tab should be display in first position.

Sandip
Top achievements
Rank 1
 updated question on 06 May 2024
3 answers
27 views

Hi there,

I am new to Kendo UI Charts. Am I getting this right? The navigator is only for stock charts?
I don't get why, this would also be very helpfull for line charts. I could only find a very old question regarding this, with not a really good answer.

Is it still the case that there is no way to display a line chart with a navigator? Or is it possible to display a line in the stockchart kind of similar to a line chart instead of candlesticks?

Best Regards,

FirestormHell

Leo
Top achievements
Rank 1
Iron
 updated answer on 30 Apr 2024
1 answer
15 views

Hello, for months I've noticed that your Angular component demonstrations have style issues as shown in the capture below. Honestly, if there's one place where one expects to judge the quality of components, it's on the vendor's demo page. I don't understand how you can let things stay like this.

 

Jonathan.

 

Martin Bechev
Telerik team
 answered on 30 Apr 2024
0 answers
15 views
Hello everyone, I have a component to graph, I am using the bar graph in this graph I have to modify the appearance of the labels, I help myself with Visual SeriesLabels to use a function that can do this.

My question is the following:
I would like to unit test this but I get an error with the "Path.fromRect" and "new Group();" functions.
Camilo
Top achievements
Rank 1
Iron
 asked on 29 Apr 2024
1 answer
29 views
is there any option to dynamically change SCSS variables runtime? please suggest best method
Yanmario
Telerik team
 answered on 29 Apr 2024
0 answers
13 views

 

Hi.

I'm trying to clear data in a control if the user has entered an incomplete date. My ControlValueAccessor, which wraps a DateTimePicker, implements the following logic.
If the control contains a {incompleteDate: true} error and the input field loses focus, patchValue(null) is executed. However, the control still contains the error {incompleteDate: true}

 

I think not correct check in this line (libs/dateinputs/src/dateinput/dateinput.component.ts)

this.isDateIncomplete = this.kendoDateObject.hasValue() && this.value === null;

full method

    private updateIncompleteValidationStatus(): void {
        const previousValue = this.isDateIncomplete;
        this.isDateIncomplete = this.kendoDateObject.hasValue() && this.value === null;  // Not correct check

        if (previousValue === this.isDateIncomplete || !this.incompleteDateValidation) { return; }

        if (isPresent(this.ngControl) && !isPresent(this.pickerService)) {
            this.cdr.markForCheck();
            this.ngZone.run(() => this.onValidatorChange());
        } else if (isPresent(this.pickerService)) {
            this.pickerService.dateCompletenessChange.emit();
        }
    }

Installed packages

"@progress/kendo-angular-dateinputs": "15.4.0",
"@angular/core": "^16.2.12",
 

Live demo

https://stackblitz.com/edit/angular-czvcsm-zrtsrw?file=src%2Fapp%2Fdate-picker%2Fdate-picker.component.html

Thanks for help.

 

Andrii
Top achievements
Rank 1
 updated question on 26 Apr 2024
Top users last month
Patrick
Top achievements
Rank 1
Iron
Iron
Iron
MIS
Top achievements
Rank 1
Ross
Top achievements
Rank 1
Marcin
Top achievements
Rank 1
Iron
Iron
Sean
Top achievements
Rank 2
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?