Question

有没有办法使用图例或任何其他按钮在Amcharts中切换趋势线（通过点击隐藏/显示）。

如果有人遇到这种情况，请帮忙提前致谢。

Answer 1

这是一篇很老的帖子，但之前的回答是误导性的，所以可能会让所有看到这个的人感到困惑。

在Amcharts中，您可以将趋势线添加为另一个图形 - 它只需要像其他图形一样提供数据。这将显示在图例中，以便您可以打开/关闭它。

Answer 2

没有隐藏/显示趋势线的方法。因此，唯一的方法是从数组中删除趋势线，验证数据，然后在需要时再次添加。

Answer 3

使用Asp.net和C＃中的数据库将数据传递到折线图中的AM图表。这是它为我工作的代码

 <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/themes/light.js"></script>
    <script src="JSfiles/jquery-1.10.2.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            var chartDataResults = new Array();
            $.ajax({
                type: 'POST',
                dataType: 'json',
                contentType: 'application/json',
                url: 'sampleLine.aspx/GetDataonload',
                data: {},
                success:
                    function (response) {

                        drawVisualization(response.d);
                    }
            });
            function drawVisualization(dataValues) {
                for (var i = 0; i < dataValues.length; i++) {
                    var dataitem = dataValues[i];
                    var date = dataitem.date;

                    var cpa = dataitem.cpacount;
                    //alert(cpa);
                    var cpi = dataitem.cpicount;
                    var cpm = dataitem.cpmcount;
                    chartDataResults.push({
                        date: date,
                        cpacount: cpa,
                        cpicount: cpi,
                        cpmcount: cpm
                    });
                    var chart = AmCharts.makeChart("chartdiv", {
                        "type": "serial",
                        "theme": "light",
                        "marginRight": 30,
                        "legend": {
                            "equalWidths": false,
                            "periodValueText": "total: [[value.sum]]",
                            "position": "top",
                            "valueAlign": "left",
                            "valueWidth": 100
                        },
                        "dataProvider":chartDataResults,
                        //"dataProvider": [{
                        //    "year": 1994,
                        //    "cars": 1587,
                        //    "motorcycles": 650,
                        //    "bicycles": 121
                        //}],
                        "valueAxes": [{
                            "stackType": "regular",
                            "gridAlpha": 0.07,
                            "position": "left",
                            "title": "Traffic incidents"
                        }],
                        "graphs": [{
                            "balloonText": "<img src='images/icons-02.jpg' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>",
                            "fillAlphas": 0.6,
                            "hidden": true,
                            "lineAlpha": 0.4,
                            "title": "CPA Count",
                            "valueField": "cpacount"
                        }, {
                            "balloonText": "<img src='images/icons-03.jpg' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>",
                            "fillAlphas": 0.6,
                            "lineAlpha": 0.4,
                            "title": "CPI Count",
                            "valueField": "cpicount"
                        }, {
                            "balloonText": "<img src='images/icons-04.jpg' style='vertical-align:bottom; margin-right: 10px; width:28px; height:21px;'><span style='font-size:14px; color:#000000;'><b>[[value]]</b></span>",
                            "fillAlphas": 0.6,
                            "lineAlpha": 0.4,
                            "title": "CPM Count",
                            "valueField": "cpmcount"
                        }],
                        "plotAreaBorderAlpha": 0,
                        "marginTop": 10,
                        "marginLeft": 0,
                        "marginBottom": 0,
                        "chartScrollbar": {},
                        "chartCursor": {
                            "cursorAlpha": 0
                        },
                        "categoryField": "date",
                        "categoryAxis": {
                            "startOnAxis": true,
                            "axisColor": "#DADADA",
                            "gridAlpha": 0.07,
                            "title": "Year",
                            "guides": [{
                                category: "2001",
                                toCategory: "2016",
                                lineColor: "#CC0000",
                                lineAlpha: 1,
                                fillAlpha: 0.2,
                                fillColor: "#CC0000",
                                dashLength: 2,
                                inside: true,
                                labelRotation: 90,
                                label: "Increased Count"
                            }, {
                                category: "2016",
                                lineColor: "#CC0000",
                                lineAlpha: 1,
                                dashLength: 2,
                                inside: true,
                                labelRotation: 90,
                                label: "Count"
                            }]
                        },
                        "export": {
                            "enabled": true
                        }
                    });
                }
            }
        });
    </script>
C# Code
        public static List<ChartDetails> GetDataonload()
        {
            string Constring = System.Configuration.ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString.ToString();
            using (SqlConnection con = new SqlConnection(Constring))
            {

                List<ChartDetails> dataList = new List<ChartDetails>();
                SqlCommand cmd = new SqlCommand("Usp_TotalcountCPA_new_usingfunction", con);
                cmd.CommandTimeout = 50;
                cmd.CommandType = CommandType.StoredProcedure;
                cmd.Parameters.AddWithValue("@iAdvertiserid", "1000120");
                con.Open();
                SqlDataAdapter da = new SqlDataAdapter(cmd);
                da.SelectCommand = cmd;
                DataTable dt = new DataTable();
                da.Fill(dt);
                con.Close();

                foreach (DataRow dtrow in dt.Rows)
                {
                    ChartDetails details = new ChartDetails();
                    string date = dtrow[4].ToString();
                    details.date = date.Substring(3, 7);
                    details.cpacount = dtrow[7].ToString();
                    details.cpicount = dtrow[10].ToString();
                    details.cpmcount = dtrow[14].ToString();
                    details.cvpcount = dtrow[16].ToString();
                    dataList.Add(details);


                }
                return dataList;
            }
        }
        public class ChartDetails
        {
            public string date { get; set; }
            public string cpacount { get; set; }
            public string cpicount { get; set; }
            public string cpmcount { get; set; }
            public string cvpcount { get; set; }
            // public string CountryCode { get; set; }
        }[![enter image description here][1]][1]

  [1]: http://i.stack.imgur.com/CvInC.png

在AmCharts中切换趋势线

3 个答案: