wso2 / react-vizgrammar Goto Github PK

Description:

In react-vizgrammar table chart, we have an option to filter data. But these filters does not work when the filtering string contains capital letters.

Suggested Labels:

Table Chart, Charts, Filters, Filterable

Suggested Assignees:

N/A

Affected Product Version:

OS, DB, other environment details and versions:

Steps to reproduce:

Create a table chart with data contains capital letters. Try to filter them out. If we use simple letters, the data will filter out, but not if we use capital letters.

Related Issues:

Description:
some parts of the tooltips are not properly displayed.

Suggested Labels:
Type: Bug, Severity : Minor

Suggested Assignees:
@CharukaK

Affected Product Version:
productSP: wso2sp-4.0.0-beta3

Description:
Currently, representation with 0 looks confusing and It will not be used.
Also, have a sample with some text in x-axis.

Description:
Currently charts append data without any animation it just pops up as it is, give an option to animate data on append and exit, and expose the ability enable/disable it from the chart configuration

Suggested Labels:
Improvements

Suggested Assignees:
@CharukaK

Description:
Most of the sample classes are missing the JS- Doc comments, add doc comments for those

Description:
Fix the graphics issue

Description:

• Use a common tooltip type across all chart types
• SVG tooltip scales down till its unreadable for smaller screens

Suggested Labels:

• Defect
• UX
• Improvement

Suggested Assignees:
@thusithak @CharukaK

Description:
When we set percentage: true in a donut chart, it shows the value as the percentage instead of the actual percentage. If we set percentage: false it will work fine.

Suggested Labels:
Arc Chart, Pie Chart, Donut Chart, Percentage

Suggested Assignees:

Affected Product Version:
0.7.16

OS, DB, other environment details and versions:
N/A

Steps to reproduce:
Create a Pie chart using following data:

chartConfig = {
  charts: [
    {
      x: 'Sales',
      type: 'arc',
      color: 'Quarter',
      mode: 'donut',
    },
  ],
  legend: true,
  percentage: true
};

metadata = {
  names: ['Quarter', 'Sales'],
  types: ['ordinal', 'linear'],
};

data = [
  ['Q1', 18],
  ['Q2', 12],
];

Try commenting out the percentage: true part, it will show correct percentages.

Related Issues:

Description:
Find a logging framework to be used in the library in the case where default console is not defined.

Description:
Have a link to source code from io site.

Description:

• Table headers, cells seems to be cluttered
• Sorting indication is not intuitive
• Fix color choosing mechanism for colored cells

Suggested Labels:

• UX
• Improvement

Suggested Assignees:
@thusithak

Description:
$Subject for map and others

Description:

Could not display the bar chart initially, it throws an error "Cannot read property 'length' of undefined" when an empty array is set for the data.
X-axis labels are not shown correctly for the bar chart.

Suggested Assignees:

@CharukaK

Description:
The following warning is displayed in the browser console when loading a line chart.

Suggested Assignees:
@erangatl

Affected Product Version:
0.6.15

Description:
$subject. The charting library should support the timestamp in milliseconds. A common use case is when siddhi aggregation timestamps in milliseconds

Suggested Labels:
Type/Improvement

Affected Product Version:
0.7.16

Description:
Give the user the ability only to define whether the chart should append or not by only by the chart configuration

Description:

The Map chart object does not have an attribute to take custom range for the value range of the legend field value. It takes the highest and the lowest values of the data array instead.

Consider a scenario in which we know that the values are ranging from 0 to 100, but the data array does not contain an entry ["Country", 0] and the ["Country", 100].
Then the lower bound will be the lowest value, and the upper bound will be the highest value. See the screenshot:

It's better if we have an option in the chart config to add lowerBound and the upperBound for the values.

Suggested Labels:

Map Chart, Chart, Values

Suggested Assignees:
@erangatl, @CharukaK

Affected Product Version:

N/A

OS, DB, other environment details and versions:

N/A

Steps to reproduce:
Create a Map chart using following data:

data = [
    ["Sri Lanka", 43],
    ["India", 21],
    ["Australia", 37]
]

This will create a Map chart, in which the value (in the legend) will show upper and lower bounds from the data array.

Related Issues:

N/A

Description:

When the Y-axis data is ordinal, the chart does not take the whole width provided. It cuts off some amount of the width.

Check the screenshot:

Even though the width is around 750px, the chart does not take the whole width.

Suggested Labels:

bar-chart, horizontal-bar-chart

Suggested Assignees:

@CharukaK @erangatl

Description:
Line chart X-axis shows double when integers are given.

Input data

Description:

I have two bar charts with different chart config. The chart config of both are given below.

    this.ChartConfig = {
        x: "username",
        charts: [
            {
                type: "bar",
                y: "duration",
                color: "sessionId",
                colorScale: ["#00e600"],
                orientation: "left",
            }
        ],
        yAxisLabel: ' Duration (s)',
        xAxisLabel: 'Username',
        maxLength: 10,
        legend: false,
        append: false,
    };

The above config is to display the session with highest duration followed by all the sessions of that particular user and the next session with highest duration. It is Bar Chart with Color Categorization.

    this.ChartConfig = {
        x: "username",
        charts: [
            {
                type: "bar",
                y: "duration",
                fill: "#00e600",
                mode: "stacked",
                orientation: "left",
            }
        ],
        yAxisLabel: ' Duration (s)',
        xAxisLabel: 'Username',
        maxLength: 10,
        legend: false,
        append: false,
    };

The above chart config displays users with average duration. It is Horizontal Bar Chart.

Both configs have common issues like x axis labels cutoff and tip cutoff where the first config has an additional issue in sorting values with respective to the duration. The following images illustrate the issues. These are relevant to version 0.7.23.

I get the following error in the console.

bundle.js:formatted:118148 TypeError: Cannot read property 'x' of undefined
at eval (eval at (bundle.js:formatted:47639), :1:174888)
at eval (eval at (bundle.js:formatted:47639), :6:799501)
at Array.reduce ()
at Object.getBaseProps (eval at (bundle.js:formatted:47639), :6:799168)
at Function.C [as getBaseProps] (eval at (bundle.js:formatted:47639), :6:226576)
at u.value (eval at (bundle.js:formatted:47639), :6:291026)
at u.value (eval at (bundle.js:formatted:47639), :6:290499)
at u.value (eval at (bundle.js:formatted:47639), :6:289626)
at updateClassInstance (bundle.js:formatted:116607)
at beginWork (bundle.js:formatted:117156)

Suggested Labels:

Suggested Assignees:

@CharukaK
Affected Product Version:
React-vizgrammar 0.7.25
OS, DB, other environment details and versions:

Steps to reproduce:
X axis labels cutoff and tip cutoff should be solved in both configs and the Bar Chart with Color Categorization should sort the values of duration(Y-axis) in descending order.

Related Issues:

Description:
Legend doesn't scale properly for smaller screens.
Use a convenient method for Legend orientation other than floats/percentages.

Suggested Labels:

• Improvement
• UX

Suggested Assignees:
@thusithak , @CharukaK

Description:

Labels of X and Y axis are not properly shown. The bar chart has to display the sessions with the respective duration of all users. For now X- axis shows only one user and the Y- axis does not show the duration correctly.

Suggested Assignees:

@CharukaK

Description:
Remake the samples to provide a more comprehensive description on the configs
Make the samples editable

Description:
The documentation does not consist of an example of how the 'onClick' method can be used with charts.

Suggested Labels:
Type/Docs

Suggested Assignees:

Affected Product Version:
Release 0.7.12

OS, DB, other environment details and versions:

Steps to reproduce:

Related Issues:

Description:
Currently in the charts legend is shown by default and it is always visible introduce an attribute to the config to show/hide legend depending on user's requirement.

Suggested Labels:
enhancement, NewFeature

Suggested Assignees:
@CharukaK

Description:
Horizontal bar charts do not put values to the axis when the data type is ordinal

Suggested Labels:
bar chart, horizontal bar chart, ordinal

Suggested Assignees:

Affected Product Version:
0.7.15

OS, DB, other environment details and versions:
N/A

Steps to reproduce:
Get a data set where the 'X' axis have ordinal values. Then try to create a horizontal bar chart using that Data.

Sample data set:

metadata:{
  names: ['username', 'authSuccessCount'],
  types: ['ordinal', 'ordinal']
}

data: {
  ["user1", 1],
  ["user2", 5],
  ["user3", 9],
  ["admin", 11],
  ["anonymous", 0]
}

Related Issues:

Description:
There are two types of graphs as shown in the image. It is better to have a grid for all graphs.

Suggested Labels:
Type: Bug, Severity: Minor

Suggested Assignees:
@CharukaK

Affected Product Version:
productSP: wso2sp-4.0.0-beta3

OS, DB, other environment details and versions:
OS: 16.04.1-Ubuntu.
web browswer: firefox - 57.0.1, chrome - 58.0.3029.110

Description:
Y axis labels in the horizontal bar chart are cutoff if they are long enough. Label must have a maximum length to avoid this.

Affected Product Version:
SP 4.3-M1

Steps to reproduce:
Create a horizontal bar chart with long enough labels to see they are cutoff at the end of the widget boundary

Description:

Pie Chart cannot remove the legend from the chart. There should be an option to remove the legend from the chard.

Suggested Labels:

Pie Chart, arc chart, legend

Suggested Assignees:

@CharukaK @erangatl

Affected Product Version:

N/A

OS, DB, other environment details and versions:

N/A

Steps to reproduce:

Related Issues:

Description:
Make Number chat decimal places show hide option through config. So that decimal places can be shown only if needed.

Suggested Labels:
Improvement

Suggested Assignees:
@CharukaK

Description:
When using color categorization with 'time' x-axis, the bars are drawn at the same place at the time point. ie, if color categorization is based on servers, drawn for time vs count.
The following data points {[Jan, Server1, 10], [Jan, Server2, 15]}, only the second data point(bar) is visible.

Suggested Labels:
Type/Bug

Suggested Assignees:
@CharukaK

Affected Product Version:
0.17.2

Description:
For some widgets, text are not visible in light mode.

In this, labels under the chart are not visible.

Suggested Labels:
Improvement

Affected Product Version:
SP Version - wso2sp-4.0.0-RC2

OS, DB, other environment details and versions:
OS: Ubuntu 16.04.3 LTS

Description:
when we disable the graphs, it will display scatter chart of lastly disable graph.

Suggested Labels:
Type: Bug, Severity : Minor

Suggested Assignees:
@CharukaK

Affected Product Version:
productSP: wso2sp-4.0.0-beta3

OS, DB, other environment details and versions:
OS: 16.04.1-Ubuntu.
web browswer: firefox - 57.0.1, chrome - 58.0.3029.110

Description:
When we create horizontal bar chart with ordinal values to X axis and linear values in Y axis, the values shown in the Y axis are erroneous. It shows the X axis values as the Y axis values, although the data points are showing data correctly.

Suggested Labels:
bar chart, horizontal bar chart, axis, values

Suggested Assignees:

Affected Product Version:
0.7.16

OS, DB, other environment details and versions:
N/A

Steps to reproduce:
Get a data set where the 'X' axis have ordinal values. Then try to create a horizontal bar chart using that Data.

Sample data set:

metadata:{
names: ['username', 'authSuccessCount'],
types: ['ordinal', 'ordinal']
}

data: {
["user1", 1],
["user2", 5],
["user3", 9],
["admin", 11],
["anonymous", 0]
}

Related Issues:
#107
#108

Description:
Currently charts only append the incoming data but if the user wants to replace the existing data and repopulate the chart there's no option given expose a prop that will accept a Boolean value so that user can configure whether to append or not

Suggested Labels:
enhancement, NewFeature

Suggested Assignees:
@CharukaK

Description:

In Map Chart, there's configuration option to provide the Choropleth value range. But in this setting, user have to provide both the upper and lower bounds as an array.

But I have a use case where only the the lower bound is known, and the upper bound should be the highest value (Which will set by default, when we do not provide the range manually).

Hence this range should be able to handle events when user is only know either lower or upper bound value.

There is also a typo in the config, it should be Choropleth, not Cloropeth.

Suggested Labels:

Map chart, Configs

Suggested Assignees:

@CharukaK, @this

Affected Product Version:

0.7.22

OS, DB, other environment details and versions:

N/A

Steps to reproduce:

N/A

Related Issues:

Map Chart legend value range should be able to customize

Description:
Implement a sorting for the data sets because the provided data can be un-ordered and this can lead to weird visualizations in the charts

Suggested Labels:
bug, Priority/High

Suggested Assignees:
@CharukaK

Description:
Overlap the graphs and tooltips

Suggested Labels:
Type/Bug, Severity/Minor

Suggested Assignees:
@CharukaK

Affected Product Version:
productSP: wso2sp-4.0.0-beta3

OS, DB, other environment details and versions:
OS: 16.04.1-Ubuntu.
web browswer: firefox - 57.0.1, chrome - 58.0.3029.110

Description:
$subject

Suggested Labels:
Type/bug

Affected Product Version:
0.7.16

Cant we put each in 2 table rows and get it fixed ?

Description:
When we have a large number of data to show in a horizontal bar chart, it is impossible to show all of them in one page. Hence pagination support is needed. The pagination support is given for the table charts, and similar support is needed.

In IS-Analytics migration from DAS to SP, we need these kind of horizontal bar charts.

Suggested Labels:
Horizontal Bar Chart, Bar Chart, Pagination, Data

Suggested Assignees:

Affected Product Version:
0.7.16

OS, DB, other environment details and versions:
N/A

Steps to reproduce:
N/A

Related Issues:
N/A

Description:
The TableChart widget currently consist of client-side pagination, and a EI-Analytics dashboard widget requires both server and client side pagination.

Suggested Labels:
Type/Improvement

Affected Product Version:
SP 4.3-M1

Description:
An error pops up and opens a blank page in the sample page log file of the error

Description:

• Implement a way of switching between material ui light and dark

Suggested Labels:

• UX
• Improvement
• Feature

Suggested Assignees:
@thusithak @CharukaK

Description:
Bar chart tool-tip appear at the end of the bar. Not on the mouse pointer. This cutoff details of the tool tip when the bar is long enough to the end.

Affected Product Version:
SP 4.3-M1

Steps to reproduce:
Create a long enough bar chart and observe it's tool-tip

Description:
The following warning is displayed in the browser console when loading a line chart.
Warning: Failed prop type: Invalid prop `children[1]` of type `array` supplied to `ChartSkeleton`, expected a single ReactElement. in ChartSkeleton

Suggested Assignees:
@erangatl

Affected Product Version:
0.6.15

Description:
Currently, charts are rendered with given ratio for width and height. Users cannot give their own width and height. So charts are not rendered correctly. Please find the below image

Description:
$Subject & the name is also wrong.

Description:
Can't create a series with an indefinite number of bars due to Victory doesn't support Auto barWidth and offset calculation. maxLength is always required to create a bar chart.

Description:

• see #27
• Need to move all the inline charting styles to a victory theme
• This will enable better state change for chart components when sample themes are switched

Suggested Labels:

• UX
• Improvement
• Feature

Suggested Assignees:
@thusithak @CharukaK