Search code examples
google-chromekendo-uicross-browsermultiple-browsers

kendo-ui radial-gauge, at chrome, pointer not displayed


I have radial-gauge of kendo-ui. However, at chrome- the pointer is not displayed. (at IE it works well). What can be the reason?

Here is my code:

html:

   <div id="empRadial" data-bind="compose: { model: radialGaugeEmp, view: 'views/widget/radialGauge/radialGauge.html' }"></div>

javascript:

    $(document).ready(function () {
            $('#empRadial').kendoRadialGauge({
                pointer: {
                    value: 116,
                },
                scale: {
                    minorUnit: 5,
                    max: 220,
                    labels: {
                        position: 'inside'
                    },
                    ranges: [{ from: 0, to: 116, color: '#121210' },
                        { from: 116, to: 220, color: '#898989' }]
                }
            });
        });

see the pictures, at chrome and at IE:

chrome IE

another datails about the differencews between browsers: when i check the element in F12, it has the next difference: IE

   <g transform="matrix(-0.549504,-0.835491,0.835491,-0.549504,110.386553,444.387814)">

   <path d="M334.735 192.434 L 175 188.434 175 196.434Z" stroke="#3f51b5" stroke-width="0.5" fill="#3f51b5"></path>

    <circle cx="175" cy="192.43375" r="8" stroke="#3f51b5" fill="#3f51b5"></circle></g>

Chrome:

   <g transform="matrix(0,0,0,0,0,0)">

      <path d="M170.75 122.563 L 100 120.563 100 124.563Z" stroke="#ea7001" stroke-width="0.5" fill="#ea7001"></path>

    <circle cx="100" cy="122.5625" r="4" stroke="#ea7001" fill="#ea7001"></circle></g>

what makes the difference??


Solution

  • Telerik team give me the answer: My problem was conflict with other library calles "date.js".