如何修复amchart v3中重叠的categoryField和工具提示文本?

时间:2019-04-29 10:52:25

标签: amcharts

我遇到 amchartv3 重叠的类别字段文本工具提示文本的问题。

我希望类别字段工具提示文字不能重叠,所以请提供解决此问题的解决方案。

这是我的输出,并且面对重叠的工具提示文本。

Overlapping categoryfield and tooltip issue img

这是我的源代码,因此请纠正错误

var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "theme": "none",
   "legend": {
			  "valueText": " [[category]] : [[value]]",
			  "valueWidth": 120,
			  "textClickEnabled": true,
			  "enabled": true,
			  "generateFromData": true,
			  "align": "left",
		},
    "dataProvider": [{
        "name": "Developer1.team1@sampletechnicaldata.co.in",
        "completed": 23.5,
        "Not Completed": 18.1,
    }, {
        "name": "Developer2.team2technical@sampletechnicaldata.co.in",
        "completed": 26.2,
        "Not Completed": 22.8
    }, {
        "name": "Developer3.team3technical@sampletechnicaldata.co.in",
        "completed": 30.1,
        "Not Completed": 1.9
    }, {
        "name": "Developer4.team4technical@sampletechnicaldata.co.in",
        "completed": 29.5,
        "Not Completed": 25.1
    }, {
        "name": "Developer5.team5technical@sampletechnicaldata.co.in",
        "completed": 1.0,
        "Not Completed": 0
    }],
    "valueAxes": [{
        "minorGridAlpha": 0.08,
        "minorGridEnabled": true,
        "position": "top",
        "axisAlpha":0
    }],
   "balloon": {
    	  "cornerRadius": 6,
    	  "horizontalPadding": 15,
    	  "verticalPadding": 10,
        },
    "startDuration": 1,
    "graphs": [{
        "balloonText": "<b'>[[title]]:<b>[[value]]</b></b>",
        "title": "completed",
        "type": "column",
        "fillAlphas": 0.8,
"fillColorsField": "color",
        "valueField": "completed"
    }, {
        "balloonText": "<b'>[[title]]:<b>[[value]]</b></b>",
        "bullet": "round",
        "bulletBorderAlpha": 1,
        "bulletColor": "#FFFFFF",
        "useLineColorForBulletBorder": true,
        "fillAlphas": 0,
        "lineThickness": 2,
        "lineAlpha": 1,
        "bulletSize": 7,
        "title": "Not Completed",
        "valueField": "Not Completed"
    }],
   "chartCursor": {
    	  "cursorAlpha": 0,
    	  "fullWidth": true
        },
    "rotate": true,
    "categoryField": "name",
    "categoryAxis": {
			  "gridPosition": "start",
			  "labelRotation": 45,
			  "title":"Xaxis"
		},
		"valueAxes": [{
		    "title": "Yaxis",
		  }],
    "export": {
    	"enabled": true
     }

});
#chartdiv {
	width	: 100%;
	height	: 500px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://www.amcharts.com/lib/3/amcharts.js"></script>
<script src="https://www.amcharts.com/lib/3/serial.js"></script>
<script src="https://www.amcharts.com/lib/3/plugins/export/export.min.js"></script>
<link rel="stylesheet" href="https://www.amcharts.com/lib/3/plugins/export/export.css" type="text/css" media="all" />
<div id="chartdiv"></div>

0 个答案:

没有答案