Отображение даты в значении оси x с использованием amCharts

У меня есть AmSerialChart с тремя AmGraph, на которых я отформатировал ballText следующим образом:

grp.balloonText = "<small><b>Date: [[category]]</b></small><br>[[value]]";

Проблема с категорией (значение x) заключается в том, что она также отображается в ballText в следующем формате: «МММ ДД, ГГГГ». Как я могу отобразить эту дату по-другому?

Я проверил dateFormats на оси категорий и dataDateFormat, но это меняет только нижнее значение.

Вот полный код:

   <script src="amcharts/amcharts.js" type="text/javascript"></script>
    <script src="amcharts/serial.js" type="text/javascript"></script>

    <script type="text/javascript">
        var chart;
        var chartData = <% properties.get("jsonData") %>;
        var chartTitles = <% properties.get("jsonTitles") %>;

        AmCharts.ready(function () {

            // SERIAL CHART
            chart = new AmCharts.AmSerialChart();
            chart.pathToImages = "amcharts/images/";
            chart.dataProvider = chartData;
            chart.categoryField = "date";
            chart.dataDateFormat = [{period:'fff',format:'JJ:NN:SS'},{period:'ss',format:'JJ:NN:SS'},{period:'mm',format:'JJ:NN:SS'},{period:'hh',format:'JJ:NN:SS'},{period:'DD',format:'JJ:NN:SS'},{period:'WW',format:'JJ:NN:SS'},{period:'MM',format:'JJ:NN:SS'},{period:'YYYY',format:'JJ:NN:SS'}];




            // listen for "dataUpdated" event (fired when chart is inited) and call zoomChart method when it happens
//               chart.addListener("dataUpdated", zoomChart);

            // AXES
            // category
            var categoryAxis = chart.categoryAxis;
            categoryAxis.parseDates = true; // as our data is date-based, we set parseDates to true
            categoryAxis.minPeriod = "ss";
            categoryAxis.minorGridEnabled = true;
            categoryAxis.axisColor = "#DADADA";
//            categoryAxis.dateFormats = [{period:'fff',format:'JJ:NN:SS'},{period:'ss',format:'JJ:NN:SS'},{period:'mm',format:'JJ:NN:SS'},{period:'hh',format:'JJ:NN:SS'},{period:'DD',format:'JJ:NN:SS'},{period:'WW',format:'JJ:NN:SS'},{period:'MM',format:'JJ:NN:SS'},{period:'YYYY',format:'JJ:NN:SS'}];

            var vAxis = new AmCharts.ValueAxis();
            chart.addValueAxis(vAxis);

            for (var i = 0; i < chartTitles.length; i++) {
                var grp = new AmCharts.AmGraph();
                grp.valueField = "d"+i;
                grp.title = chartTitles[i];
                grp.type = "line";
                grp.valueAxis = vAxis; // indicate which axis should be used 
                grp.lineThickness = 1;
                grp.bullet = "round";
                grp.labelPosition = "right";
                grp.balloonText = "<small><b>Date: [[category]]</b></small><br>[[value]]";
                grp.balloonText = "[[value]], [[description]], [[percents]], [[open]], [[total]], [[category]]";
                grp.showBalloon = true;
                grp.bulletSize = 1;
                grp.bulletBorderThickness = 6;
                grp.dashLengthField = "dashLength";

                chart.addGraph(grp);
            }


            // SCROLLBAR
            var chartScrollbar = new AmCharts.ChartScrollbar();
            chart.addChartScrollbar(chartScrollbar);

            // LEGEND
            var legend = new AmCharts.AmLegend();
            legend.marginLeft = 180;
            legend.useGraphSettings = true;
            chart.addLegend(legend);

            // WRITE
            chart.write("chartdiv");
        });




    </script>
    <div id="chartdiv" style="width: 100%; height: 360px;"></div>

person aF.    schedule 02.12.2013    source источник
comment
Я хочу использовать categoryBalloonDateFormat без chartCursor.   -  person aF.    schedule 02.12.2013


Ответы (1)


Хорошие вопросы, которые помогли мне узнать, что у меня отсутствует свойство в документах. Если вы не используете ChartCursor, вы должны использовать свойство chart.balloonDateFormat для форматирования даты.

person zeroin    schedule 03.12.2013