You are viewing a plain text version of this content. The canonical link for it is here.
Posted to dev@echarts.apache.org by GitBox <gi...@apache.org> on 2018/11/19 18:25:24 UTC

[GitHub] arashdalir opened a new issue #9429: need to get axisLabel.maxLabel

arashdalir opened a new issue #9429: need to get axisLabel.maxLabel
URL: https://github.com/apache/incubator-echarts/issues/9429
 
 
   - [x] I am using English in this issue.
   
   
   ## General Questions
   - [x] I have read the document and examples and tried to solve it by myself.
   - [x] I have searched for similar issues and that didn't help.
   - [x] I have tried with the latest version of ECharts and still have this problem.
   
   In this issue, I have provided information with:
   - [x] issue type
   - [x] one sentence description in issue details
   - [ ] demo if this is bug report
   
   ## Issue Type
   
   <!-- Add `x` for the ones that is true with you, e.g.: [x] I have ... -->
   
   - [x] I have a question to ask about *how to use ECharts to ...*
   - [ ] I have a bug to report
   - [x] I have a feature to request, e.g.: *I'd like a new feature that ...*
   - [ ] I have a feature to enhance, e.g.: *The current feature should be improved in the way that ...*
   - [ ] There's something wrong with the documents
   - [ ] Others, or I'm not sure which issue types to choose here
   
   ## Issue Details
   
   <!-- Use one sentence to describe what you want and what's wrong. -->
   
   right now, it's not possible to programmatically check what the maximum label value for `yAxis` is (at least there is no documentation showing how to get it. 
   as shown in the following example, we are trying to determine if some points of different series overlap, and if so, we want to use a bigger `symbolSize` to indicate that 2 points overlap. to do so, the function `dynamicSymbolSize` in my example is created. it works by normalizing the values defined as a `seriesGroup` by determining what the highest value of their corresponding `yAxis` is. this would have worked/will work ONLY IF `yAxis.max` is already predefined or by coincident, if the highest value is also the highest axisLabel. otherwise the normalization doesn't work as wished. 
   
   if you check my example, the part marked with `//TODO` is where I need a function like `yAxis.getMaxLabel()` or whatever it's called/is going to be called; or a property which delivers the set value.
   
   ### Expected Behavior
   
   <!-- Add screenshots to demo if necessary. -->
   
   the function `yAxis.getMaxLabel()` (or the property...) should deliver the maximum value used for labeling `yAxis`.
   
   
   ### Current Behavior
   
   <!-- Add screenshots to demo if necessary. Otherwise, replace the following line with N/A. -->
   
   I have not found any function/property that does this.
   
   
   ### Online Example
   
   <!-- Please use jsfiddle.net or gallery.echartsjs.com to provide a simplest demo to show the problem. And do not upload zip demos. -->
   <!-- THIS IS REQUIRED FOR ALL BUG REPORTS AND QUESTIONS!!! -->
   
   https://jsfiddle.net/byn4eLvp/2/
   
   <!-- Please make your demo as simple as possible to help locate the problem. And paste only necessary part of code here. -->
   
   ```javascript
   var dynamicSymbolSize = function (value, params, dataHelper, basicSize, seriesGroup, chart){
   	var default_value = basicSize;
   	var multiplier = 1;
   	var axisInfo = {
   		max: {},
   		axisSeries:{}
   	};
   	var j = 0;
   
   	var seriesName = params.seriesName;
   
   	if (typeof chart !== typeof undefined)
   	{
   		if (!chart.hasOwnProperty('axisInfo') || !chart.axisInfo || !chart.axisInfo.axisSeries.hasOwnProperty(seriesName))
   		{
   			if (chart.hasOwnProperty('axisInfo'))
   			{
   				axisInfo = chart.axisInfo;
   			}
   
   			var config = chart.getOption();
   
   			console.log(config);
   
   			for (var s = 0; s < config.series.length; s++)
   			{
   				var series = config.series[s];
   				var index = null;
   				if ((index = seriesGroup.indexOf(series.name)) !== -1)
   				{
   					var col = series.name;
   
   					var yAxisIndex = series.yAxisIndex;
   
   					if (typeof yAxisIndex !== typeof undefined && yAxisIndex !== null)
   					{
   						var yAxis = config.yAxis[yAxisIndex];
   
   						var max = null;
   
   						if (yAxis.max)
   						{
   							max = yAxis.max;
   						}
   						else
   						{
   							//TODO: use yAxis.getMax() instead.
   							max = dataHelper.getMax(col); 
   						}
   						if (!axisInfo.max.hasOwnProperty(yAxisIndex))
   						{
   							axisInfo.max[yAxisIndex] = 0;
   						}
   						if (!axisInfo.axisSeries.hasOwnProperty(series.name))
   						{
   							axisInfo.axisSeries[series.name] = yAxisIndex;
   						}
   
   						axisInfo.max[yAxisIndex] = Math.max(axisInfo.max[yAxisIndex], max);
   					}
   				}
   
   			}
   
   			chart.axisInfo = axisInfo;
   		}
   		else
   		{
   			axisInfo = chart.axisInfo;
   		}
   	}
   
   	//<script>
   	var row = dataHelper.find(dataHelper.getKeyColumn(), value[0]);
   
   	if(row && seriesGroup)
   	{
   		row = row[0];
   
   		// traverse the columns in reverse order - higher indices will be drawn on top of lower ones.
   
   		for(j = seriesGroup.length - 1; j >= 0; j--)
   		{
   			var column = seriesGroup[j];
   
   			if(column === seriesName)
   			{
   				break;
   			}
   
   			var seriesMax = 0;
   			var columnMax = 0;
   			if (axisInfo.max)
   			{
   				columnMax = axisInfo.max[axisInfo.axisSeries[column]];
   				seriesMax = axisInfo.max[axisInfo.axisSeries[seriesName]];
   			}
   
   			var normalizedSeriesVal = seriesMax?(value[1]/seriesMax):0;
   			var normalizedColumnVal = seriesMax?(row[column]/columnMax):0;
   
   			if(Math.abs(normalizedColumnVal - normalizedSeriesVal) <= 0.005)
   			{
   				multiplier++;
   			}
   		}
   	}
   
   	return multiplier * default_value;
   };
   //<script>
   var data_records_5bf2e4e667126_dup_5bf2e4e68d677 = new EChartsData({
   	"source": [
   		/*
   		{
   			"time": "2016-02-10 02:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "120",
   			"user_ok": 68,
   			"user_uc": 34,
   			"user_nc": 2,
   			"user_nok": "52",
   			"user_nr": 16,
   			"trans_tot": "139",
   			"trans_ok": 78,
   			"trans_uc": 39,
   			"trans_nc": 2,
   			"trans_suc": 78,
   			"trans_nr": 20,
   			"user_suc": 79.07
   		}, {
   			"time": "2016-02-10 03:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "110",
   			"user_ok": 68,
   			"user_uc": 38,
   			"user_nc": 0,
   			"user_nok": "42",
   			"user_nr": 4,
   			"trans_tot": "143",
   			"trans_ok": 87,
   			"trans_uc": 50,
   			"trans_nc": 0,
   			"trans_suc": 93.55,
   			"trans_nr": 6,
   			"user_suc": 94.44
   		}, {
   			"time": "2016-02-10 04:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "111",
   			"user_ok": 77,
   			"user_uc": 30,
   			"user_nc": 0,
   			"user_nok": "34",
   			"user_nr": 4,
   			"trans_tot": "136",
   			"trans_ok": 93,
   			"trans_uc": 34,
   			"trans_nc": 0,
   			"trans_suc": 91.18,
   			"trans_nr": 9,
   			"user_suc": 95.06
   		},
   		*/
   		{
   			"time": "2016-02-10 05:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "114",
   			"user_ok": 77,
   			"user_uc": 33,
   			"user_nc": 0,
   			"user_nok": "37",
   			"user_nr": 4,
   			"trans_tot": "135",
   			"trans_ok": 92,
   			"trans_uc": 37,
   			"trans_nc": 0,
   			"trans_suc": 93.88,
   			"trans_nr": 6,
   			"user_suc": 95.06
   		}, {
   			"time": "2016-02-10 06:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "117",
   			"user_ok": 78,
   			"user_uc": 33,
   			"user_nc": 0,
   			"user_nok": "39",
   			"user_nr": 6,
   			"trans_tot": "143",
   			"trans_ok": 100,
   			"trans_uc": 36,
   			"trans_nc": 0,
   			"trans_suc": 93.46,
   			"trans_nr": 7,
   			"user_suc": 92.86
   		}, {
   			"time": "2016-02-10 07:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "126",
   			"user_ok": 84,
   			"user_uc": 35,
   			"user_nc": 0,
   			"user_nok": "42",
   			"user_nr": 7,
   			"trans_tot": "143",
   			"trans_ok": 97,
   			"trans_uc": 39,
   			"trans_nc": 0,
   			"trans_suc": 93.27,
   			"trans_nr": 7,
   			"user_suc": 92.31
   		}, {
   			"time": "2016-02-10 08:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "122",
   			"user_ok": 82,
   			"user_uc": 36,
   			"user_nc": 0,
   			"user_nok": "40",
   			"user_nr": 4,
   			"trans_tot": "132",
   			"trans_ok": 87,
   			"trans_uc": 39,
   			"trans_nc": 0,
   			"trans_suc": 93.55,
   			"trans_nr": 6,
   			"user_suc": 95.35
   		}, {
   			"time": "2016-02-10 09:00:00.000000",
   			"scenario": 1080,
   			"scenario_name": "Inbound Authentication",
   			"imsi_group_id": "1",
   			"imsi_group_name": "HPLMN",
   			"user_tot": "120",
   			"user_ok": 84,
   			"user_uc": 31,
   			"user_nc": 0,
   			"user_nok": "36",
   			"user_nr": 5,
   			"trans_tot": "140",
   			"trans_ok": 96,
   			"trans_uc": 37,
   			"trans_nc": 0,
   			"trans_suc": 93.2,
   			"trans_nr": 7,
   			"user_suc": 94.38
   		}
   	],
   	"dimensions": [
   		{
   			"name": "time",
   			"type": "time",
   			"displayName": "Time",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "scenario",
   			"type": "int",
   			"displayName": "Scenario",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "user_ok",
   			"type": "float",
   			"displayName": "User OK",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "user_uc",
   			"type": "float",
   			"displayName": "User UC",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "user_nc",
   			"type": "float",
   			"displayName": "User NC",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "user_nr",
   			"type": "float",
   			"displayName": "User NR",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "user_suc",
   			"type": "float",
   			"displayName": "User Success",
   			"color": null,
   			"hide": false,
   			"format": {"conversion_factor": 1, "type": "normal", "suffix": null, "format": 8, "momentJsFormat": null}
   		}, {
   			"name": "trans_ok",
   			"type": "float",
   			"displayName": "Trans OK",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "trans_uc",
   			"type": "float",
   			"displayName": "Trans UC",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "trans_nc",
   			"type": "float",
   			"displayName": "Trans NC",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "trans_nr",
   			"type": "float",
   			"displayName": "Trans NR",
   			"color": null,
   			"hide": false,
   			"format": null
   		}, {
   			"name": "trans_suc",
   			"type": "float",
   			"displayName": "Trans Success",
   			"color": null,
   			"hide": false,
   			"format": {"conversion_factor": 1, "type": "normal", "suffix": null, "format": 8, "momentJsFormat": null}
   		}
   	],
   	"keyColumn": "time"
   });
   data_records_5bf2e4e667126_dup_5bf2e4e68d677.setData(data_records_5bf2e4e667126_dup_5bf2e4e68d677.convert());
   var line_chart1_inbound = echarts.init(document.getElementById('line_chart_1_inbound'), null, {
   	"devicePixelRatio": null,
   	"renderer": "svg",
   	"width": 570,
   	"height": 450
   });
   
   line_chart1_inbound.setOption({
   	"dataZoom": [
   		{"show": true, "xAxisIndex": [0, 1], "start": 0, "end": 100, "type": "inside"}, {
   			"show": true,
   			"xAxisIndex": [0, 1],
   			"start": 0,
   			"end": 100,
   			"type": "slider"
   		}
   	],
   	"grid": [
   		{
   			"show": true,
   			"left": "13%",
   			"width": "85%",
   			"top": 25,
   			"height": 175,
   			"borderColor": "transparent",
   			"containLabel": "1"
   		}, {
   			"show": true,
   			"left": "13%",
   			"width": "85%",
   			"top": 210,
   			"height": 195,
   			"borderColor": "transparent",
   			"containLabel": "1"
   		}
   	],
   	"xAxis": [
   		{
   			"show": true,
   			"gridIndex": 0,
   			"type": "time",
   			"scale": true,
   			"axisLine": {"lineStyle": {"color": "#999999"}},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}},
   			"splitNumber": "10"
   		}, {
   			"show": true,
   			"gridIndex": 1,
   			"type": "time",
   			"scale": true,
   			"axisLine": {"lineStyle": {"color": "#999999"}},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}}
   		}
   	],
   	"yAxis": [
   		{
   			"show": true,
   			"gridIndex": 0,
   			"type": "value",
   			"name": "Users",
   			"nameRotate": 90,
   			"nameGap": 40,
   			"nameLocation": "middle",
   			"nameTextStyle": {"fontWeight": "bolder", "fontSize": 15},
   			"axisLine": {"lineStyle": {"color": "#999999"}},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}},
   			"splitNumber": "10"
   		}, {
   			"show": true,
   			"gridIndex": 0,
   			"type": "value",
   			"max": 100,
   			"axisLine": {"lineStyle": {"color": "#9a322e"}},
   			"splitLine": {"show": false},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}},
   			"splitNumber": "10"
   		}, {
   			"show": true,
   			"gridIndex": 1,
   			"type": "value",
   			"name": "Transactions",
   			"nameRotate": 90,
   			"nameGap": 40,
   			"nameLocation": "middle",
   			"nameTextStyle": {"fontWeight": "bolder", "fontSize": 15},
   			"axisLine": {"lineStyle": {"color": "#999999"}},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}},
   			"splitNumber": "10"
   		}, {
   			"show": true,
   			"gridIndex": 1,
   			"type": "value",
   			"max": 100,
   			"axisLine": {"lineStyle": {"color": "#9a322e"}},
   			"splitLine": {"show": false},
   			"splitArea": {"areaStyle": {"color": ["rgba(250,250,250,0.3)", "rgba(200,200,200,0.3)"]}},
   			"splitNumber": "10"
   		}
   	],
   	"series": [
   		{
   			"name": "user_ok",
   			"type": "line",
   			"xAxisIndex": 0,
   			"yAxisIndex": 0,
   			"data": data_records_5bf2e4e667126_dup_5bf2e4e68d677.getColumn(['time', 'user_ok']),
   			"hasValues": true,
   			"itemStyle": {"color": "#00a650", "borderWidth": "2", "opacity": "1"},
   			"symbol": "circle",
   			"symbolSize": function (value, params){
   				return dynamicSymbolSize(value, params, data_records_5bf2e4e667126_dup_5bf2e4e68d677, 4, ["user_ok",  "user_suc"], line_chart1_inbound);
   			},
   			"lineStyle": {"color": "#00a650", "width": "2", "type": "solid", "opacity": "1"}
   		},
   		{
   			"name": "user_suc",
   			"type": "line",
   			"xAxisIndex": 0,
   			"yAxisIndex": 1,
   			"itemStyle": {"color": "#9a322e", "borderWidth": "2", "opacity": "1"},
   			"data": data_records_5bf2e4e667126_dup_5bf2e4e68d677.getColumn(['time', 'user_suc']),
   			"hasValues": true,
   			"symbol": "circle",
   			"symbolSize": function (value, params){
   				return dynamicSymbolSize(value, params, data_records_5bf2e4e667126_dup_5bf2e4e68d677, 4, ["user_ok",  "user_suc"], line_chart1_inbound);
   			},
   			"lineStyle": {"color": "#9a322e", "width": "2", "type": "solid", "opacity": "1"}
   		}, {
   			"name": "trans_ok",
   			"type": "line",
   			"xAxisIndex": 1,
   			"yAxisIndex": 2,
   			"data": data_records_5bf2e4e667126_dup_5bf2e4e68d677.getColumn(['time', 'trans_ok']),
   			"hasValues": true,
   			"itemStyle": {"color": "#00a650", "borderWidth": "2", "opacity": "1"},
   			"symbol": "circle",
   			"symbolSize": function (value, params){
   				return dynamicSymbolSize(value, params, data_records_5bf2e4e667126_dup_5bf2e4e68d677, 4, ["trans_ok", "trans_suc"], line_chart1_inbound);
   			},
   			"lineStyle": {"color": "#00a650", "width": "2", "type": "solid", "opacity": "1"}
   		},
   		{
   			"name": "trans_suc",
   			"type": "line",
   			"xAxisIndex": 1,
   			"yAxisIndex": 3,
   			"itemStyle": {"color": "#9a322e", "borderWidth": "2", "opacity": "1"},
   			"data": data_records_5bf2e4e667126_dup_5bf2e4e68d677.getColumn(['time', 'trans_suc']),
   			"hasValues": true,
   			"symbol": "circle",
   			"symbolSize": function (value, params){
   				return dynamicSymbolSize(value, params, data_records_5bf2e4e667126_dup_5bf2e4e68d677, 4, ["trans_ok", "trans_suc"], line_chart1_inbound);
   			},
   			"lineStyle": {"color": "#9a322e", "width": "2", "type": "solid", "opacity": "1"}
   		}
   	],
   	"title": [
   		{
   			"show": true,
   			"text": "Inbound",
   			"textStyle": {"fontSize": 15, "fontWeight": "bold", "color": "#306fb6"},
   			"width": "100%",
   			"top": "top",
   			"left": "center",
   			"subtextStyle": {
   				"color": "#306fb6",
   				"rich": {
   					"hr": {
   						"borderColor": "#999999",
   						"width": "100%",
   						"borderWidth": "1",
   						"height": "0",
   						"lineHeight": "10"
   					}
   				}
   			}
   		}
   	],
   	"backgroundColor": "#ffffff",
   	"textStyle": {"color": "#306fb6"},
   	"legend": {"show": "", "width": "80%", "top": "10%", "left": "center", "textStyle": {"color": "#306fb6"}}
   });
   ```
   
   ## Topics
   
   <!-- Check those topics that are related. -->
   - [ ] Legend
   - [ ] Tooltip
   - [ ] Event
   - [ ] Performance
   - [ ] SVG
   - [ ] Map
   - [ ] ECharts GL
   - [ ] Third-party libraries, e.g.: Vue.js, React
   
   
   ## Anything Else We Need to Know
   
   <!-- You may reference other issues here. Otherwise, replace the following line with N/A. -->
   
   Ahm, I don't think so, please ask if you need...
   
   
   ## Environment
   
   - ECharts version: latest
   

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
users@infra.apache.org


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: dev-unsubscribe@echarts.apache.org
For additional commands, e-mail: dev-help@echarts.apache.org