首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >设置群集条形图的标题[AmCharts]不起作用

设置群集条形图的标题[AmCharts]不起作用
EN

Stack Overflow用户
提问于 2015-09-10 18:44:28
回答 1查看 598关注 0票数 0

我想设置标题,但不能使用群集条形图(串行)图。我使用(http://docs.amcharts.com/3/javascriptmaps/Title)中描述的“标题”。它适用于饼图,但不适用于群集条形图(串行图)。我将示例代码包含在jsfiddle中。

代码语言:javascript
复制
var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "theme": "light",
    "titles": [{
        "text": "Hours Plot",
        "size": 15
     }],
    "legend": {
        "useGraphSettings": true
      },
    "categoryField": "discipline",
    "rotate": true,
    "startDuration": 0,
    "categoryAxis": {
        "gridPosition": "start",
        "position": "left"
    },
    "trendLines": [],
    "graphs": [
        {
            "balloonText": "Budget Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-1",
            "lineAlpha": 0.2,
            "title": "Budget Hours",
            "type": "column",
            "valueField": "budgetHours"
        },
        {
            "balloonText": "Earned Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-2",
            "lineAlpha": 0.2,
            "title": "Earned Hours",
            "type": "column",
            "valueField": "earnedHours"
        },
        {
            "balloonText": "Actual Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-3",
            "lineAlpha": 0.2,
            "title": "Actual Hours",
            "type": "column",
            "valueField": "actualHours"
        },
        {
            "balloonText": "Forecast Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-4",
            "lineAlpha": 0.2,
            "title": "Forecast Hours",
            "type": "column",
            "valueField": "forecastHours"
        }
    ],
    "guides": [],
    "valueAxes": [
        {
            "id": "ValueAxis-1",
            "position": "top",
            "axisAlpha": 0
        }
    ],
    "allLabels": [],
    "balloon": {},
    "titles": [],
    "dataProvider": [
        {
            "discipline": "Completion",
            "budgetHours": 23.5,
            "earnedHours": 18.1,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Insulation",
            "budgetHours": 26.2,
            "earnedHours": 22.8,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Electrical",
            "budgetHours": 30.1,
            "earnedHours": 23.9,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Mechanical",
            "budgetHours": 29.5,
            "earnedHours": 25.1,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Piping",
            "budgetHours": 24.6,
            "earnedHours": 25,
            "actualHours": 10,
            "forecastHours": 11
        },
        {
            "discipline": "Civil",
            "budgetHours": 24.6,
            "earnedHours": 25,
            "actualHours": 10,
            "forecastHours" : 11
        }
    ],
    "export": {
        "enabled": true
     }
});

http://jsfiddle.net/q0eLc28j/1/

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-09-13 04:57:44

图表配置中有两个title数组。一个是你期望的,另一个是空的。后者覆盖第一个,因此没有标题。

只需删除空的"titles": [], 1即可。

代码语言:javascript
复制
var chart = AmCharts.makeChart("chartdiv", {
    "type": "serial",
    "theme": "light",
    "titles": [{
        "text": "Hours Plot",
        "size": 15
     }],
    "legend": {
        "useGraphSettings": true
      },
    "categoryField": "discipline",
    "rotate": true,
    "startDuration": 0,
    "categoryAxis": {
        "gridPosition": "start",
        "position": "left"
    },
    "trendLines": [],
    "graphs": [
        {
            "balloonText": "Budget Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-1",
            "lineAlpha": 0.2,
            "title": "Budget Hours",
            "type": "column",
            "valueField": "budgetHours"
        },
        {
            "balloonText": "Earned Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-2",
            "lineAlpha": 0.2,
            "title": "Earned Hours",
            "type": "column",
            "valueField": "earnedHours"
        },
        {
            "balloonText": "Actual Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-3",
            "lineAlpha": 0.2,
            "title": "Actual Hours",
            "type": "column",
            "valueField": "actualHours"
        },
        {
            "balloonText": "Forecast Hours:[[value]]",
            "fillAlphas": 0.8,
            "id": "AmGraph-4",
            "lineAlpha": 0.2,
            "title": "Forecast Hours",
            "type": "column",
            "valueField": "forecastHours"
        }
    ],
    "guides": [],
    "valueAxes": [
        {
            "id": "ValueAxis-1",
            "position": "top",
            "axisAlpha": 0
        }
    ],
    "allLabels": [],
    "balloon": {},
    // the following line needs to be removed
    // "titles": [],
    "dataProvider": [
        {
            "discipline": "Completion",
            "budgetHours": 23.5,
            "earnedHours": 18.1,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Insulation",
            "budgetHours": 26.2,
            "earnedHours": 22.8,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Electrical",
            "budgetHours": 30.1,
            "earnedHours": 23.9,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Mechanical",
            "budgetHours": 29.5,
            "earnedHours": 25.1,
            "actualHours": 10,
            "forecastHours" : 11
        },
        {
            "discipline": "Piping",
            "budgetHours": 24.6,
            "earnedHours": 25,
            "actualHours": 10,
            "forecastHours": 11
        },
        {
            "discipline": "Civil",
            "budgetHours": 24.6,
            "earnedHours": 25,
            "actualHours": 10,
            "forecastHours" : 11
        }
    ],
    "export": {
        "enabled": true
     }
});

更新小提琴:http://jsfiddle.net/q0eLc28j/3/

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32509483

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档