Forum Discussion

JayeeDee's avatar
JayeeDee
Frequent Visitor
8 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
    8 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
    Super User
    8 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
      8 months ago

      Absolutely! Here's the desired outcome...

  • lbendlin's avatar
    lbendlin
    Super User
    8 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.