Two charts on one page generating js error

12 posts, 1 answers
  1. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 09 Jan 2013 Link to this post

    Hello

    I am new to kendoui, and i am testing a new dashboard for a project of mine.

    The idea is... i have a pie chart and a line chart on the page, and i can not initialize them at once. 

    I am calling $("#container").kendoChart(...); twice.

    Either way i try only the first chart loads. When i try to load them individually they are ok, but when i load both i get this:

    Timestamp: 01/09/13 18:26:06
    Error: on is undefined
    Source File: http://pms.igeek.ro/3rdparty/kendo/js/kendo.dataviz.min.js
    Line: 10

    Have just downloaded kendo ui trial so i have the latest version.

    Thanks,

    Chris

    Any help would be welcome
  2. Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 09 Jan 2013 Link to this post

    Hi Razvan,

    I am not able to reproduce the problem. Could you please give me more information about your scenario(or you can just update my test project)? 

    Regards,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 09 Jan 2013 Link to this post

    I pasted my code there and it works... are there any known incompatibility issues with other javascripts? 

    I have loaded A LOT. 

    Also the tooltips aren't visible.

    Here is the list of java scripts i load:



    <script type="text/javascript" src="/3rdparty/jquery.1.6.2.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.validate.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/dataTables/media/js/jquery.dataTables.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jqueryUi/js/jquery-ui-1.8.15.custom.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.scrollTo-1.4.2-min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.formatCurrency-1.4.0.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.ui.touch-punch2.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jcrop/js/jquery.color.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jcrop/js/jquery.Jcrop.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.maskedinput-1.3.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/tiptip/jquery.tipTip.minified.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/flot/jquery.flot.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/flot/jquery.flot.pie.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/uniform/jquery.uniform.min.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jeditable/jquery.jeditable.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.generateId.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>3rdparty/jquery.jeditable.ckeditor.js"></script>
    <!--FancyBox-->
    <script type="text/javascript" src="<?php echo base_url() ?>/3rdparty/fancybox/lib/jquery.mousewheel-3.0.6.pack.js"></script>
    <script type="text/javascript" src="<?php echo base_url() ?>/3rdparty/fancybox/source/jquery.fancybox.js"></script>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>/3rdparty/fancybox/source/jquery.fancybox.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>/3rdparty/fancybox/source/helpers/jquery.fancybox-buttons.css?v=2.0.4" />
    <script type="text/javascript" src="<?php echo base_url() ?>/3rdparty/fancybox/source/helpers/jquery.fancybox-buttons.js?v=2.0.4"></script>
    <link rel="stylesheet" type="text/css" href="<?php echo base_url() ?>/3rdparty/fancybox/source/helpers/jquery.fancybox-thumbs.css?v=2.0.4" />
    <script type="text/javascript" src="<?php echo base_url() ?>/3rdparty/fancybox/source/helpers/jquery.fancybox-thumbs.js?v=2.0.4"></script>
    <!--Kendo UI-->
    <link href="<?php echo base_url() ?>3rdparty/kendo/css/kendo.common.min.css" rel="stylesheet">
    <link href="<?php echo base_url() ?>3rdparty/kendo/css/kendo.metro.min.css" rel="stylesheet">
    <script src="<?php echo base_url() ?>3rdparty/kendo/js/kendo.dataviz.min.js"></script>
  4. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 09 Jan 2013 Link to this post

    I tried replying 6x here... no idea why it did not work initially.

    I added my code and it works.. i got a lot of jscripts loaded... any idea of known incompatibilities with kendoui and other java scripts?

    I also have jQuery 1.6.2 ...
  5. Atanas Korchev
    Admin
    Atanas Korchev avatar
    8462 posts

    Posted 09 Jan 2013 Link to this post

    Hello,

     We are not sure what you mean by "other java scripts". Please clarify.

    Kind regards,
    Atanas Korchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 09 Jan 2013 Link to this post

    Could not post everything i load... maybe post was too big? posting this and editing after

    Here's a screenshot, apparently i can't post the copy-paste from my header:

    http://screencast.com/t/EgjRYLj2akKA
  7. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 10 Jan 2013 Link to this post

    apparently jQuery 1.8.2 fixed it.

    Question: Can i apply formatting on the numbers on the pie chart and the line charts? I have dollar amounts and i'd like to have them formatted $xxx,xxx.xx (i currently just have $xxxxxx)
  8. Answer
    Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 10 Jan 2013 Link to this post

    Hello Razvan,

    You need to use format property of the chart labels. Example:

    $("#chart").kendoChart({
      series: [{
        type: "line",
        labels: {
          visible: true,
          format: "C"
        },
        data: [1000000,200000,300000]
      }]
    });

    All the best,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  9. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 10 Jan 2013 Link to this post

    And another question... can i adjust the location of the tooltip? right now it's on the right of the cursor and it goes offscreen at the right edge of the chart. Can i set it up to appear on the left?

    Screenshot: http://screencast.com/t/LKsigEXJELQ
  10. Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 10 Jan 2013 Link to this post

    Hi Razvan,

    We have not scheduled this feature for implementation yet thus we cannot commit with an exact deadline. Once we plan it it would appear in our public roadmap. Please accept our apologies for the inconvenience this may cause.

    Regards,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  11. Razvan
    Razvan avatar
    8 posts
    Member since:
    Jan 2013

    Posted 10 Jan 2013 Link to this post

    It's cool - i can find a workaround that

    I have changed a couple of things and i need to format the tooltip, but with a template -- http://screencast.com/t/RdeRmtGdwbl

    Is that possible?
  12. Hristo Germanov
    Admin
    Hristo Germanov avatar
    703 posts

    Posted 14 Jan 2013 Link to this post

    Hi Razvan,

    Yes, you can format the tooltip in the template. You can call kendo.format or kendo.toString in the template. Could you please examine our online documentation?

    Greetings,
    Hristo Germanov
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top