Forum Discussion

Astroraf's avatar
Astroraf
Data Integration
11-19-2025
Solved

How to create a week date range with start and end if the week for each week?

Hi DRay​ Liliia_DevX​ ,

I am looking to create a week range for a line/column/bar chart where lets say it is the 30th week of 2024, then the 31st, 2024 and I want the 30th and 31 st week to shows Sep 24 - Sep 31 2024, etc. Is there a way to achieve this within the model or in the back end of a live data model. 

CUSTOM DATE RANGE
dashboard design
DATE RANGE
  • Liliia_DevX's avatar
    Liliia_DevX
    11-20-2025

    Hi :)

    Please try this approach suggested by OleksiiDemianyk​. On the client you need to:

    • Add 6 days to each date returned by Sisense;
    • Change category from the default one to the ${startWeekDate} - ${startWeekDate + 7 days}

    This can be done on the event beforeviewloaded. Here is the sample where we have week as the only category:

    const months = { 1: 'Jan', 2: 'Feb', 3: 'Mar', 4: 'Apr', 5: 'May', 6: 'Jun', 7: 'Jul', 8: 'Aug', 9: 'Sep', 10: 'Oct', 11: 'Nov', 12: 'Dec' }; widget.on('beforeviewloaded', (scope, args) => { const [ seria ] = args.options.series; seria.data.forEach((point, index) => { const startDate = formatDate(point.selectionData[0]); const endDate = formatDate(new Date( new Date(point.selectionData[0]).getTime() + 6 * 24 * 60 * 60000), true); args.options.xAxis.categories[index] = `${startDate} - ${endDate}`; }) }) function formatDate( dateItem, returnYear = false ) { const [ year, monthIndex, date ] = dateItem.toISOString().substr(0, 10).split('-'); const monthString = months[parseInt(monthIndex)]; return returnYear ? `${date} ${monthString} ${year}` : `${date} ${monthString}`; }

    Hope that helps!

4 Replies

  • Liliia_DevX's avatar
    Liliia_DevX
    Sisense Employee
    11-20-2025

    Hi :)

    Please try this approach suggested by OleksiiDemianyk​. On the client you need to:

    • Add 6 days to each date returned by Sisense;
    • Change category from the default one to the ${startWeekDate} - ${startWeekDate + 7 days}

    This can be done on the event beforeviewloaded. Here is the sample where we have week as the only category:

    const months = { 1: 'Jan', 2: 'Feb', 3: 'Mar', 4: 'Apr', 5: 'May', 6: 'Jun', 7: 'Jul', 8: 'Aug', 9: 'Sep', 10: 'Oct', 11: 'Nov', 12: 'Dec' }; widget.on('beforeviewloaded', (scope, args) => { const [ seria ] = args.options.series; seria.data.forEach((point, index) => { const startDate = formatDate(point.selectionData[0]); const endDate = formatDate(new Date( new Date(point.selectionData[0]).getTime() + 6 * 24 * 60 * 60000), true); args.options.xAxis.categories[index] = `${startDate} - ${endDate}`; }) }) function formatDate( dateItem, returnYear = false ) { const [ year, monthIndex, date ] = dateItem.toISOString().substr(0, 10).split('-'); const monthString = months[parseInt(monthIndex)]; return returnYear ? `${date} ${monthString} ${year}` : `${date} ${monthString}`; }

    Hope that helps!

    • Astroraf's avatar
      Astroraf
      Data Integration
      11-21-2025

      Hi Liliia_DevX​ ,

      Is there a way to do this without a widget edit script? As Compose SDK by Widget ID does not allow widget edit scripts to be render the changes when embedding.

      • Liliia_DevX's avatar
        Liliia_DevX
        Sisense Employee
        12-04-2025

        Hi,

        It should be possible to add custom columns in the model for the start and end dates and concatenate them into a string to use as the dimension. Otherwise, swap 'beforeviewloaded' for onBeforeRender prop in CSDK and use the same logic to manipulate highcharts options.

        Hope that helps :)

  • DRay's avatar
    DRay
    Sisense Employee
    12-12-2025

    Hi Astroraf​,

    I’m following up to see if the solution offered by Liliia_DevX​ worked for you.

    If so, please click the 'Accept as Solution' button on their post. That way others with the same questions can find the answer. If not, please let us know so that we can continue to help.

    Thank you.