Question

我试图改变子弹的形象我点击（在amchart中）它不会影响任何。

我试图拥有一个eventlistner，并更改函数中项目的属性。但它不会对ui产生任何影响

任何人都知道为什么？

 $(document).ready(function () {

        Try();

    });

    function Randomize() {

        return Math.floor((Math.random() * 10) + 1);
    }

    function Try() {

        var chart = AmCharts.makeChart("chartdiv", {
            "type": "serial",
            "theme": "none",
            "pathToImages": "http://www.amcharts.com/lib/3/images/",
            "dataProvider":

                buildMe()

            ,

            "balloon": {
                "cornerRadius": 6
            },
            "valueAxes": [{
                "duration": "mm",
                "durationUnits": {
                    "hh": "h ",
                    "mm": "min"
                },
                "axisAlpha": 0
            }],
            "graphs": [{
                "bullet": "square",
                "bulletSize": 14,
                "customBullet": "http://www.amcharts.com/lib/3/images/star.png",
                "bulletBorderAlpha": 1,
                "bulletBorderThickness": 1,
                "fillAlphas": 0.3,
                "fillColorsField": "lineColor",
                "legendValueText": "[[value]]",
                "lineColorField": "lineColor",
                "customBulletField": "customBullet",
                "title": "duration",
                "valueField": "duration"
            }],
            "chartScrollbar": {},
            "chartCursor": {
                "categoryBalloonDateFormat": "YYYY MMM DD",
                "cursorAlpha": 0,
                "zoomable": false
            },
            "dataDateFormat": "YYYY-MM-DD",
            "categoryField": "date",
            "categoryAxis": {
                "dateFormats": [{
                    "period": "DD",
                    "format": "DD"
                }, {
                    "period": "WW",
                    "format": "MMM DD"
                }, {
                    "period": "MM",
                    "format": "MMM"
                }, {
                    "period": "YYYY",
                    "format": "YYYY"
                }],
                "parseDates": true,
                "autoGridCount": false,
                "axisColor": "#555555",
                "gridAlpha": 0,
                "gridCount": 50
            }
        });
         var graph = new AmCharts.AmGraph();
        chart.addListener("clickGraphItem", ChangePan,$(this));

    }


    function ChangePan(event) {
        event.item.dataContext.customBullet = "http://www.amcharts.com/lib/3/images/redstar.png";
        event.item.lineColor = "http://www.amcharts.com/lib/3/images/redstar.png";
         console.log(event.item.dataContext.customBullet);
        console.log(event.item);
    }

    function buildMe() {
        console.log('im in ?')
        var mystring = "";
        var year = 0;
        var month = 0;
        var session = 6;
        var training = 7;

        mystring += "[";
        for (var j = 0; j < training + 1; j++) {

            mystring += '{';


            if (Randomize() < 7) {
                mystring += '"lineColor": "#2498d2",';
            }
            else {
                mystring += '"lineColor": "#1153e6",';
            }
            mystring += ' "date": "2015-07-'+ j +'", "duration": ';

            mystring += Randomize();

           // mystring += ',"customBullet": "http://www.amcharts.com/lib/3/images/redstar.png"';

            if (training == j) {
                mystring += "}";
            }
            else {
                mystring += "},";
            }


        }
        mystring += "]";
        console.log(mystring)
        console.log(JSON.parse(mystring))
        return JSON.parse(mystring);
    }

这是我的jsfiddle。

Answer 1

AmCharts不会收听dataContext更改，因此您必须使用validateData()自行完成。但是，由于图表被完全重绘，该点将失去其悬停状态。 Fiddle

点击上的amchart changebullet

1 个答案: