amchart在网格之间添加标签 [英] amchart add labels in between grids

查看:211
本文介绍了amchart在网格之间添加标签的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

不损害当前网格的数量。所以网格线的数量应该保持11,标签的数量将增加到21.希望清除我的查询。以上是我的图表,这是代码 -

  var chart = AmCharts.makeChart(chartdiv,{
type:xy,
dataProvider: json,
valueAxes:
[
{
id:my_y,
autoGridCount:false,
position: right,
tickLength:0,
gridThickness:0.25,
minimum: - 100,
maximum:100,
GRI dCount:11,
labelFrequency:0.5,
gridColor:black,
gridAlpha:0.50,
labelOffset:-356,
axisAlpha:0,
strictGridCount:true,
},
{
id:my_x,
autoGridCount:false ,
position:bottom,
tickLength:0,
gridThickness:0.25,
minimum: - 100,
maximum :100,
gridCount:11,

labelFrequency:0.5,
gridColor:black,
gridAlpha:0.50,
labelOffset:-320,
axisAlpha:0,
},
],
borderAlpha:0,
startDuration :0,

legend:[{
useGraphSettin gs:false,
verticalGap:0,
}],
guides:[
{
fillAlpha:0.10,
价值:-100,
toValue:100,
}
],
图表:
[
{
id:g1,
lineColor:#FF6600,
bulletBorderThickness:1,
hideBulletsCount:30,
animationDuration:0 ,
balloonText:[[value]],
bullet:circle,
lineAlpha:0,$ b $valueField:value ,
xField:x,
yField:y,
fillAlphas:0,
bulletBorderAlpha:0,
minBulletSize:30,
maxBulletSize:30,
labelText:[[x]],
labelPosition: inside,
markerType:none,
可切换:false,
},
],
marginLeft:20,
marginBottom:20,
export:{
enabled:true,
menu:[],
},
});

PS:我尝试更改labelFrequency值,但我认为它不会将值设置为1以下。

解决方案

假设 labelFrequency 不能是设置为低于1的任何值,或者是一个非整数。



我能想到的唯一解决方法是增加 gridCount code>到以您想要的增量显示标签的数字。即21。

然后完全禁用网格线。 ( gridAlpha:0



最后使用指南在需要显示行的值处显示行。即:

  {
id:my_y,
autoGridCount:false,
position:right,
tickLength:0,
gridThickness:0.25,
minimum:-100,
maximum: 100,
gridCount:21,
labelFrequency:0.5,
gridColor:black,
gridAlpha:0,
labelOffset :-356,
axisAlpha:0,
strictGridCount:true,
guides:[
{value:80,lineAlpha:0.5 },
{value:60,lineAlpha:0.5},
{value:40,lineAlpha:0.5},
{value:20, lineAlpha:0.5},
{value:0,lineAlpha:0.5},
{value:-20,lineAlpha:0.5},
{value :-40,lineAlpha:0.5},
{value:-60,lineAlpha:0.5},
{value:-80,lineAlpha:0.5}
]
}


I need to add labels with difference of 10 in both axis( one each between the grid ), WITHOUT compromising the present number of grids.So the number of grid lines should stay 11 and number of labels will go up to 21. Hope that clears my query.Above is my chart, and this is the code -

var chart = AmCharts.makeChart("chartdiv", {                      
    "type": "xy",
    "dataProvider": json,   
    "valueAxes":
    [                                           
        {
            "id":"my_y",
            "autoGridCount": false,
            "position": "right",
            "tickLength":0,
            "gridThickness":0.25,
            "minimum":-100,
            "maximum":100,                          
            "gridCount": 11, 
            "labelFrequency" : 0.5,
            "gridColor":"black",  
            "gridAlpha":0.50,   
            "labelOffset": -356,
            "axisAlpha":0,      
            "strictGridCount" : true,
        }, 
        {
            "id":"my_x",        
            "autoGridCount": false, 
            "position": "bottom",                       
            "tickLength":0,
            "gridThickness": 0.25,                          
            "minimum":-100,
            "maximum":100,
            "gridCount": 11,

            "labelFrequency" : 0.5,
            "gridColor":"black",
            "gridAlpha":0.50,
            "labelOffset": -320,                    
            "axisAlpha":0,
        },   
    ],
    "borderAlpha" : 0, 
    "startDuration": 0, 

    "legend":[{                     
        "useGraphSettings": false,
        "verticalGap":0,
    }],
    "guides":[
                {
                  "fillAlpha": 0.10,
                  "value": -100,
                  "toValue": 100,                         
                }
            ],
    "graphs": 
    [                                
        {
            "id":"g1",
            "lineColor": "#FF6600",
            "bulletBorderThickness": 1,
            "hideBulletsCount": 30,
            "animationDuration":0,
            "balloonText": "[[value]]",
            "bullet": "circle",
            "lineAlpha": 0,
            "valueField": "value",
            "xField": "x",
            "yField": "y",
            "fillAlphas": 0,
            "bulletBorderAlpha": 0,
            "minBulletSize": 30,
            "maxBulletSize": 30,
            "labelText":"[[x]]",
            "labelPosition":"inside",
            "markerType" : "none",
            "switchable":false,
        }, 
    ],
    "marginLeft": 20,
    "marginBottom": 20,         
    "export": {
    "enabled": true,
    "menu" : [],
    },
}); 

PS : I tried to change the labelFrequency value but I don't think it takes values below 1.

解决方案

You're right to assume that labelFrequency can't be set to anything lower than 1, or a non-integer for that matter.

The only workaround I can think of is to increase gridCount to the number which displays labels in increments that you want. I.e. 21.

Then disable grid lines altogether. (gridAlpha: 0)

And finally use guides to display lines at values that you need lines displayed at. I.e.:

{
  "id": "my_y",
  "autoGridCount": false,
  "position": "right",
  "tickLength": 0,
  "gridThickness": 0.25,
  "minimum": -100,
  "maximum": 100,
  "gridCount": 21,
  "labelFrequency": 0.5,
  "gridColor": "black",
  "gridAlpha": 0,
  "labelOffset": -356,
  "axisAlpha": 0,
  "strictGridCount": true,
  "guides": [
    { "value": 80, "lineAlpha": 0.5 },
    { "value": 60, "lineAlpha": 0.5 },
    { "value": 40, "lineAlpha": 0.5 },
    { "value": 20, "lineAlpha": 0.5 },
    { "value": 0, "lineAlpha": 0.5 },
    { "value": -20, "lineAlpha": 0.5 },
    { "value": -40, "lineAlpha": 0.5 },
    { "value": -60, "lineAlpha": 0.5 },
    { "value": -80, "lineAlpha": 0.5 }
  ]
}

这篇关于amchart在网格之间添加标签的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆