简单的甜甜圈图表与拉斐尔 [英] Simple Donut Chart with Raphael

问题描述

使用如何在raphael中实现带路径的甜甜圈洞中的示例（。

这不是最佳解决方案，但它可以帮助你。

Using the example from "How to achieve donut holes with paths in raphael" ( How to achieve 'donut holes' with paths in Raphael ) I was able to tweek the code a bit more to my use-case.

My next goal with this is to enlarge one of the sectors on mouse over, without pulling it away from the inside circle. Is this possible?

Here's the current code: http://jsfiddle.net/Swivelgames/efb9n/1/

I'm hoping to make it look like this:

解决方案

Evening,

I've sort of cheated here. The way the donut is working right now is by using scaling, but to do what you want you can't go that way. The options are to recalculate the sector, or to cheat. I've done both.

I've added a second donut with bigger sectors, which I've then hidden. On the original donut, the mouseover hides the appropriate sector and displays the sector from the bigger ring.

The outer ring has a mouseout function which reverses the process.

Heres a fiddle that hopefully shows it working.

It's not the optimal solution, but it might help you along.

这篇关于简单的甜甜圈图表与拉斐尔的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！