number formatting for area chart tooltip

3 posts, 1 answers
  1. toy
    toy avatar
    9 posts
    Member since:
    May 2013

    Posted 20 May 2013 Link to this post

    hello.  currently the number in my tooltip looks like this "$ 1234567" but how do i make it look like "$ 1,234,567"?
    $J("#chart").kendoChart({
        dataSource: {
            data:source,
            group: {
                field: "MDetail",
                dir: "asc"
            },
            sort: {
                field: "Month",
                dir: "asc"
            }
        },
        theme: "blueOpal",
        title: {
            text: "Total Cost of Workforce for " + year
        },
        legend: {
            position: "bottom"
        },
        seriesDefaults: {
            type: "area",
            format: "${0:0,000}"
        },
        series: [{
            field: "Amount",
            groupNameTemplate: "#= group.value # "
        }],
        valueAxis: {
            labels: {
                template: "#= kendo.format('$ {0:N0}', value / 1000000) # M"
            },
            majorUnit: 100000000,
            line: {
                visible: false
            },
            axisCrossingValue: -10
        },
        categoryAxis: {
            field: "Month",
            majorGridLines: {
                visible: false
            }
        },
        tooltip: {
            visible: true,
            format: "$ {0:0,000}"
        }
    });
  2. Answer
    Iliana Nikolova
    Admin
    Iliana Nikolova avatar
    2622 posts

    Posted 21 May 2013 Link to this post

    Hi Toy,

    In order to achieve this you could use a custom format for the Chart's tooltip. As an example: 
    $("#chart").kendoChart({
      //....
      tooltip: {
         visible: true,
         format: "$ ##,#"
      }
    });
    Please have in mind the "Amount" field should be number, not string.
     
    Regards,
    Iliana Nikolova
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. toy
    toy avatar
    9 posts
    Member since:
    May 2013

    Posted 21 May 2013 Link to this post

    iliana
    thanks - yes i had tried that number format as well
    but as you suspected it had more to do wtih the var type
Back to Top