Forum Discussion

JayeeDee's avatar
JayeeDee
Frequent Visitor
10 months ago
Solved

How to unalign points?

Can someone help me figure out how to make it so the points for 'City 3' are not aligned on the same x-axis? Each occurs in its own row and has a Year or YearId column that I'd like to use to solve it, but I'm not sure how. I did some research and found detail channel, but that did not work.

 

 

 
 
 
 
 
 
 
 
 
 
 
```DemoTable = DATATABLE(
"Year", INTEGER,
"CurrentPlayer", STRING,
"Date", DATETIME,
"YearId", STRING,
"City", STRING,
"Winner", STRING,
"Round", INTEGER,
  {
    {2019,"Bill","04/02/2019","2019-76","City 1","Sue", 4},
    {2019,"Bill","05/02/2019","2019-146","City 2","Sally", 2},
    {2020,"Bill","09/07/2020","2020-205","City 3","Randy", 7},
    {2021,"Bill","05/03/2021","2021-205","City 3","Randy", 3},
    {2022,"Bill","05/02/2022","2022-205","City 3","Andre", 6},
    {2023,"Bill","05/08/2023","2023-205","City 3","Dan", 4},
    {2024,"Bill","05/06/2024","2024-205","City 3","Barry", 5},
    {2025,"Bill","05/05/2025","2025-205","City 3","Barry", 3}
  }
)```
 
```
{
  "title": "Annual Performance",
  "description": "Annual performance of ATP player",
  "width": 570,
  "data": {"name": "dataset"},
  "layer": [
    {
      "mark": {
        "type": "line",
        "tooltip": true
      },
      "encoding": {
        "y": {
          "field": "Level",
          "type": "quantitative",
          "axis": {"title": "Level"}
        },
        "x": {
          "field": "City",
          "type": "nominal",
          "sort": {"field": "Date", "order": "ascending"},
          "axis": {
            "title": "City",
            "labelAngle":-50
          }
        }
      }
    },
    {
      "mark": {
          "type": "point",
          "tooltip": true,
          "filled": true
      },
      "encoding": {
        "y": {
          "field": "Level",
          "type": "quantitative",
          "axis": {"title": "Level"}
          },
        "x": {
          "field": "City",
          "type": "ordinal",
          "sort": {"field": "Date", "order": "ascending"}
        },
        "color": {
          "condition": {
              "test": "datum.Round === 7 && datum.Winner === datum.CurrentPlayer",
              "value": "red"
          },
        "value": "DodgerBlue"
        }
      }
    }
  ]
}
```
  • lbendlin's avatar
    lbendlin
    10 months ago

    Make the year the x axis and the city the legend.

     

    Note: since year is temporal you could now even reconsider using a line chart, a stacked line chart, or a ribbon chart.

9 Replies

  • GeraldGEmerick's avatar
    GeraldGEmerick
    Icon for Memorable Member rankMemorable Member
    10 months ago

    JayeeDee What would you like it to look like instead? You could add additional columns to the x-axis to make a hierarchy that you could drill through but I am unclear if that that is what you are looking to do. Maybe a sketch of what you would rather have?

    • JayeeDee's avatar
      JayeeDee
      Frequent Visitor
      10 months ago

      Absolutely! Here's the desired outcome...

  • lbendlin's avatar
    lbendlin
    Icon for Super User rankSuper User
    10 months ago

    Do not use a line chart for independent (nominal) data points. Line charts should only ever be used to show temporal progression, or phase transitions.

    • JayeeDee's avatar
      JayeeDee
      Frequent Visitor
      10 months ago

      What would you recommend for my use case?