怎么用css画如下的锥形图 比较难

如果用css画完锥后，怎么定位锥的尖，显示文字和气泡，我没有写过canvas，请convas高手随便挑一个颜色帮忙实现一个。

---

https://jsfiddle.net/imys/3hvramt9/

用了两种实现方法，border 和 transform:skew，缺点就是不好控制。
我是一点点调出来的，最好还是用 canvas 实现。