Chart.js带滑块

Question

尝试在Chart.js中包含滑块。我尝试按照sgrillion发布的代码进行操作，但无法使其正常工作。我还想将工具提示添加到滑块手柄。是否有另一种方法可以在不丢失每个滑块的文本或数据的情况下完成此操作？这是代码和结果：     示例代码在Jsfiddle上：我用过     jQuery的ui.css     jQuery的1.10.js     jQuery的ui.js     Chary.js         

index

<div class="titre">Coffee:</div>
    <div id="red"></div>
    <div class="titre">Bun:</div>
    <div id="green"></div>
    <div class="titre">Cake:</div>
    <div id="blue"></div>
    <div class="titre">Tea:</div>
    <div id="yellow"></div>
    <div class="titre">Water:</div>
    <div id="sienna"></div>
    <div class="titre">Donut:</div>
    <div id="gold"></div>
    <div class="titre">Spaghetti:</div>
    <div id="violet"></div>

 <canvas id="canvas" height="300" width="300"></canvas>

我想最终得到更接近这个的东西：