2017-11-04 5 views
2

私はWheelnav jsを使用して各タイトルを円の内側(赤い領域)に揃えようとしていますが、何か不足しています。 mousescrollingで項目をスクロールできる必要がありますが、どちらも起こっていません。 (クリックメニューではスクロールが機能しています)。Wheelnav jsは円にタイトルを合わせます

ありがとうございました。

var wheel = new wheelnav("wheelDiv"); 
wheel.wheelRadius = wheel.wheelRadius * 2;//2 
wheel.navItemsContinuous = true; 
wheel.sliceAngle = 8; 
wheel.colors = colorpalette.gamebookers; 
wheel.slicePathFunction = slicePath().NullSlice; 

var anchorAttr = "middle"; 
wheel.titleFont1 = "200 24px Impact, Charcoal, sans-serif"; 
wheel.titleFont2 = "200 34px Impact, Charcoal, sans-serif"; 
wheel.titleAttr = {fill: "#bbb", textAlign: "left", font: wheel.titleFont1,"text-anchor":anchorAttr}; 
wheel.titleHoverAttr = {font: wheel.titleFont1, cursor: 'pointer',"text-anchor":anchorAttr}; 
wheel.titleSelectedAttr = { fill: "#000", textAlign: "left", font: wheel.titleFont2,"text-anchor":anchorAttr}; 

wheel.animatetime = 500; 
wheel.animateeffect = 'linear'; 

wheel.createWheel(["Menu Item -1","Menu - 2","Active Menu Item","Menu - 4","Menu Item - 5","Menu - 6","Active Menu Item","Menu - 8"]); 

enter image description here

答えて

1

あなたはinitWheel関数の後、各navItemのプロパティを変更することができます。 タイトルの配置は、slicePathCustomizationによって可能です。

wheel.initWheel(["Menu Item -1", "Menu - 2", "Active Menu Item", "Menu - 4", "Menu Item - 5", "Menu - 6", "Active Menu Item", "Menu - 8"]); 

//Initial 
wheel.sliceInitPathFunction = slicePath().NullSlice; 
wheel.navItems[0].sliceInitPathCustom = new slicePathCustomization(); 
wheel.navItems[0].sliceInitPathCustom.titleRadiusPercent = 0.1; 
//Default 
wheel.slicePathFunction = slicePath().NullSlice; 
wheel.navItems[0].slicePathCustom = new slicePathCustomization(); 
wheel.navItems[0].slicePathCustom.titleRadiusPercent = 0.2; 
//Hover 
wheel.sliceHoverPathFunction = slicePath().NullSlice; 
wheel.navItems[0].sliceHoverPathCustom = new slicePathCustomization(); 
wheel.navItems[0].sliceHoverPathCustom.titleRadiusPercent = 0.3; 
//Selected 
wheel.sliceSelectedPathFunction = slicePath().NullSlice; 
wheel.navItems[0].sliceSelectedPathCustom = new slicePathCustomization(); 
wheel.navItems[0].sliceSelectedPathCustom.titleRadiusPercent = 0.4; 

wheel.createWheel(); 

カスタマイズの詳細here

+0

マニュアルにもかかわらず、ありがとうございますが、それにもかかわらず動作します。 :) – Deb

関連する問題