VisActor VBI
  • Bahasa Indonesia

      • Sort

      Pengurutan Internal Legenda

      Pengurutan Internal Legenda

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "column",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 15
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 33
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 22
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 14
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 30
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "count",
      "alias": "Jumlah"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "profit",
      "alias": "Laba"
    }
  ],
  "sortLegend": {
    "order": "desc"
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Metrik

      Pengurutan Metrik

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 15
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 33
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 22
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 14
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 30
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "count",
      "alias": "Jumlah"
    },
    {
      "id": "sales",
      "alias": "Penjualan",
      "parentId": "group"
    },
    {
      "id": "profit",
      "alias": "Laba",
      "parentId": "group"
    }
  ],
  "sortLegend": {
    "order": "desc",
    "orderBy": "sales"
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Metrik

      Pengurutan Metrik

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 15
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 33
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 22
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 14
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 30
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "count",
      "alias": "Jumlah"
    },
    {
      "id": "sales",
      "alias": "Penjualan",
      "parentId": "group"
    },
    {
      "id": "profit",
      "alias": "Laba",
      "parentId": "group"
    }
  ],
  "sort": {
    "order": "desc",
    "orderBy": "sales"
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Dimensi

      Pengurutan Dimensi

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 50
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 50
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 50
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Laba"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "count",
      "alias": "Jumlah"
    }
  ],
  "sortLegend": {
    "order": "desc",
    "orderBy": "date"
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Dimensi

      Pengurutan Dimensi

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 50
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 50
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 50
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Laba"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "count",
      "alias": "Jumlah"
    }
  ],
  "sort": {
    "order": "desc",
    "orderBy": "date"
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Kustom

      Pengurutan Kustom

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 50
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 50
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 50
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Laba"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "count",
      "alias": "Jumlah"
    }
  ],
  "sort": {
    "customOrder": [
      "2022",
      "2023",
      "2021",
      "2020",
      "2019"
    ]
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Kustom (ID Legenda)

      Pengurutan Kustom (ID Legenda)

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "columnParallel",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 50
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 50
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 50
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Laba"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "count",
      "alias": "Jumlah"
    }
  ],
  "sortLegend": {
    "customOrder": [
      "Jumlah-count",
      "Penjualan-sales",
      "Laba-profit"
    ]
  }
}

  return <VSeedRender vseed={vseedConfig} />
}

      Pengurutan Kustom (Nama Legenda)

      Pengurutan Kustom (Nama Legenda)

      import { VSeedRender } from '@components'

export default () => {
  const vseedConfig = {
  "chartType": "line",
  "dataset": [
    {
      "date": "2019",
      "profit": 10,
      "sales": 20,
      "count": 50
    },
    {
      "date": "2020",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2021",
      "profit": 30,
      "sales": 60,
      "count": 50
    },
    {
      "date": "2022",
      "profit": 50,
      "sales": 100,
      "count": 50
    },
    {
      "date": "2023",
      "profit": 40,
      "sales": 80,
      "count": 50
    }
  ],
  "dimensions": [
    {
      "id": "date",
      "alias": "Tanggal"
    }
  ],
  "measures": [
    {
      "id": "profit",
      "alias": "Laba"
    },
    {
      "id": "sales",
      "alias": "Penjualan"
    },
    {
      "id": "count",
      "alias": "Jumlah"
    }
  ],
  "sortLegend": {
    "customOrder": [
      "Penjualan",
      "Jumlah",
      "Laba"
    ]
  }
}

  return <VSeedRender vseed={vseedConfig} />
}