Display title series in tooltip - charts

I need display in tooltip title series chart. I have many series in my chart.
I try this:
->add series to chart<-
addSeries("Title1", new dojox.charting.StoreSeries(store, {query: {}}, {x: "time", y: "tzewn", text: "Title1"})).
I get data from json file. But text: isn't in my store data.
->tooltip<-
new dojox.charting.action2d.Tooltip(chartT, "default"
,{text: function(e) {
var tooltiptext = e.y +", "+e.text;
return tooltiptext;
}
}
);
but I get: (e.y) the correct value and undefined (e.text),
How I can display name series in tooltip?

Your StoreSeries is defined to look for a property named "Title1" in each object that comes from the store and assign that value to "text".
If you want the name of the series in your tooltip text, then try using e.run.name in your tooltip text function:
new dojox.charting.action2d.Tooltip(chartT, "default", {
text: function(e) {
return e.y.y + ", " + e.run.name;
}
});

Related

How to remove series value from hover tooltip apex charts pie

I want to just remove the number 33 from this, I want it to just show series-4
what to do to hide it from tooltip?
You can customize the tooltip by providing formatters. In this case, you'll want to override both the title (seriesName) and the y value label. In place of the y value, return a blank string.
You'll need to provide a formatter for the title as well because not doing so will default to the series title being shown followed by a colon.
tooltip: {
y: {
formatter: function(val) {
return ''
},
title: {
formatter: function (seriesName) {
return seriesName
}
}
}
}

How to format a value from model before it is used as a control property?

var oModel = new sap.ui.model.json.JSONModel();
var modelData = {
greet: "hello"
};
oModel.setData(modelData);
var oTextView = new sap.ui.commons.TextView({
text: "{/greet}" + "?" // "{/greet}" interpreted as ordinary string in this case
});
oTextView.setModel(oModel);
oTextView.placeAt("content");
To make the issue simple, my problem can be simplified as follows:
I would like to append a question mark to the text of a TextView. However, the leading part of the text is from the model. Indeed, in this simple case, I could have accessed the text from the model before it is combined with the question mark. After the target string is produced, I can assign it to the text property of TextView. However, what if the model gets changed else where? The code accessing the text property won't be guaranteed to be executed, so the text of TextView won't get updated?
Is there any way to solve this problem?
You can use complex binding syntax for this. Simply add this to your bootstrap:
data-sap-ui-xx-bindingSyntax="complex"
This enables you to combine model values with static text values like this:
var oTextView = new sap.ui.commons.TextView({
text: "{/greet} ?"
});
or even something like this:
var oTextView = new sap.ui.commons.TextView({
text: "{/lastName}, {/firstName}"
});
If your static text part depends on the model value you can add a formatter function, for example:
var oTextView = new sap.ui.commons.TextView({
text: {
path : "/greet", // no curly braces here!
formatter : function(greet) {
if(greet === "hello") {
return greet + "!";
} else if (greet === "how are you") {
return greet + "?";
} else {
return greet;
}
}
});

SAPUI5 Combination Chart data and chart formatting

I would like to create a SAPUI5 combination chart - a column chart with a line for a particular category for each month that will compare one year to another. There are about 11 possible categories that the user can choose but the chart would only show one category's information at a time.
It would be similar to the following for one category:
I can create the chart to show data but I am having trouble converting it to use the data based on a category. I would think I can do what I want but I think the issue is in how my data is supplied.
This is my json (I am showing two categories in the data for example - I would like to be able to apply a filter for the category the user chooses):
{
"bullet": [{
"field":"Products Classified",
"months":[{
"month":"1",
"current":"17",
"previous":"140"
} ,{
"month":"2",
"current":"37",
"previous":"66"
},{
"month":"3",
"current":"60",
"previous":"66"
},{
"month":"4",
"current":"41",
"previous":"121"
}]
}, {
"field":"Products Not Classified",
"months":[{
"month":"1",
"current":"7",
"previous":"25"
} ,{
"month":"2",
"current":"50",
"previous":"78"
},{
"month":"3",
"current":"55",
"previous":"56"
},{
"month":"4",
"current":"45",
"previous":"60"
}]
}]
}
Here is part of my controller....
var oModel = new JSONModel("ByYear_sum.json");
sap.ui.model.FilterOperator.EQ, filterText);
var oDataset = new FlattenedDataset({
dimensions: [{
name: "Month",
value: "{month}"
}],
measures: [{
name: "Start Year",
value: "{current}"
},{
name: "End Year",
value: "{previous}"
}],
data: {
path: "/bullet"
filters: [oFilter]
}
});
oVizFrame.setDataset(oDataset);
oVizFrame.setModel(oModel);
oVizFrame.setVizProperties({
plotArea: {
dataLabel: {
visible: true,
formatString: '#,##0'
}
},
valueAxis: {
title: {
visible: false
}
},
legend: {
title: {
visible: false
}
},
title: {
visible: true,
text: 'Year Comparison'
}
});
var feedValueAxis = new FeedItem({
'uid': "valueAxis",
'type': "Measure",
'values': ["Start Year", "End Year"]
}),
feedCategoryAxis = new FeedItem({
'uid': "categoryAxis",
'type': "Dimension",
'values': ["Month"]
});
The value of filterText would be used to show the chart information for the chosen category (for example Products classified or Products Not classified).
I tried putting /months/ in front of the values (for example "{/months/previous}") to get to the values for the category (i.e. Products classified) but it doesn't seem to find the data properly (I get no data).
I would also like to display the text value of the month, not the number, how can I apply a formatter to the value?
My example chart shows year numbers....The years being compared come from user input, I currently cannot figure out how to get the values of the years chosen to show - I had to put 'Start Year' and 'End Year'. Is there a way to make the legend and popover show the year values (so dynamic based on user input)? Everything I tried gave me errors and wouldn't display the chart - I think because the feeds needed to match the same text and when I tried using a value it couldn't match.
I was finally able to get this to work, with some guidance from others.
1) In the title, I was able to set and update the title properties when the user chose a different filter.
2) The path was incorrect as well....it should have been /bullet/0/months - the '0' changes depending on the filter. I just had to get the index of the category chosen and use that for the path.
3) I changed my data to return the month abbreviation, instead of the number.
4) I was finally able to get the years to show both in the legend and the popup if you click a data point. In the FlattenedDataSet definition, I put a variable name in that is passed in when creating the FlattenedDataSet - so example: name was name: sYr, where sYr was passed in and the value of the year. In the FeedItem creation, the values look like: 'values': [sYr, eYr] I thought I had tried these, but it seemed to work with all the other changes that were made. I just had to create new FlattenedDataSet and FeedItems (and remove the old FeedItems) and update the chart with the new values.

Pie chart in sapui5

I have a dropdown in which i have dropdown values as Zone and State.
Now when i select Zone from the dropdown then iam displaying a pie chart with zone values and on select of pie chart section
iam displaying only the selected zone values in a table.
(for example if i select south section from the pie chart then only the south zone records will be displayed in table).
That i have done.
But when i select the State from the dropdown the pie chart with state values is displaying but on click of pie chart section the records are not displaying in the table.
So far i have used these code............
var oEvDataSet = new sap.viz.ui5.data.FlattenedDataset("EV_REPORT_DATASET", {
dimensions: [{
name: "ZONE",
axis: 1,
value: "{Key}"
}],
measures: [{
name: "NUMBER",
value: "{Number}"
}],
data: {
path: "EVENTREPORT>/ZONE"
//path: "EVENTREPORT>/Category"
}
});
var line = new sap.viz.ui5.Pie({
width: "60%",
height: "500px",
dataset: oEvDataSet
});
var fSelectionChanged = function(oEvent) {
var data = this.selection();
// var country,dso;
var dataFilter = [];
for (i in data) {
var zone = data[i].data.ZONE;
//var state = data[i].data.STATE;
// state = data[i].data.STATE;
dataFilter.push(new sap.ui.model.Filter("ZONE", "EQ", zone));
//dataFilter.push(new sap.ui.model.Filter("STATE","EQ",state));
}
for (i in eventReportAllFilter) {
dataFilter.push(eventReportAllFilter[i]);
// dataFilter.push(new sap.ui.model.Filter("STATE","EQ",state));
}
//dataFilter.push(eventReportAllFilter);
Ev_oTable_AllVenues.bindRows('AM_EventList>/eventlist', oERZoneSorter, dataFilter);
};
line.attachSelectData(fSelectionChanged);
line.attachDeselectData(fSelectionChanged);
line.attachInitialized(function() {});
oER_VerLayout.addContent(line);
U can also see in the image.
In the image if i select dropdown value as state the pie chart is displaying but on select of pie chart section the values are not displaying in the table.
How can i do this..??
Please help me on this.
Thanks
Sathish

Kendo Chart Missing CategoryAxis Text for multiple series

I am creating a kendo chart that can have multiple datasets.
I am creating a chartOptions object that is only being manipulated by referencing the properties and is not manipulated through Kendo functionality. This is done by the following code:
var chartOptions = {
theme: "",
seriesDefaults: {
type: "line"
},
title: {
text: ""
},
legend: {
position: "bottom"
},
series: "",
categoryAxis: {
field: "category"
}
};
function createChart() {
$("#chart").kendoChart(
$.extend(true, {}, chartOptions)
);
}
I also have the user defining which datasets they want. The choose their datasets and create their chart. The chart is then rendered but missing its categoryAxis data.
I am setting the series data (the data comes from the server, but is available for example) in the following way:
dataSetContents.Series = {"Series":[{"name":"2009 Data","data":[{"category":"2008","value":18159},{"category":"2007","value":315},{"category":"2009","value":8}]},{"name":"2008-2010","data":[{"category":"2010","value":750},{"category":"2009","value":2980},{"category":"2008","value":4135},{"category":"2007","value":55}]}]}
chartOptions.series = dataSetContents.Series;
I figured out the reason why I was losing my categories. It has to do with the multiple series, the way to fix this by setting the categoryAxis. This can be done by passing the array of categories like this:
chartOptions.categoryAxis = { categories: [2007,2008,2009,2010] };