// Drop Shadowエフェクトの使用例
// UMDビルドではThematikaオブジェクトから直接アクセス

// カスタムDrop Shadowフィルターの作成
const dropShadowFilter = Thematika.createDropShadow({
    id: 'custom-shadow',
    dx: 4,              // X方向のオフセット
    dy: 4,              // Y方向のオフセット
    stdDeviation: 3,    // ぼかしの強度
    floodColor: '#000000',  // 影の色
    floodOpacity: 0.4       // 影の透明度
});

// SVGのdefsにフィルターを追加
const svg = d3.select('#map svg');
const defs = svg.append('defs');
dropShadowFilter(defs);

// GeojsonLayerにフィルターを適用
const worldLayer = new Thematika.GeojsonLayer({
    data: geojson,
    attr: {
        'fill': (d, i) => {
            // 高さを表現するグラデーションカラー
            const colors = ['#3b82f6', '#10b981', '#f59e0b', '#ef4444', '#8b5cf6'];
            return colors[i % colors.length];
        },
        'filter': dropShadowFilter.url(),  // Drop Shadowフィルターを適用
        'stroke': '#ffffff',
        'stroke-width': 0.5,
        'opacity': 0.9
    }
});

// プリセットフィルターの使用例
const standardShadow = Thematika.FilterPresets.standardDropShadow();
const softShadow = Thematika.FilterPresets.softDropShadow();

// ハードシャドウ（カスタム定義）
const hardShadow = Thematika.createDropShadow({
    id: 'hard-shadow',
    dx: 6,
    dy: 6,
    stdDeviation: 1,
    floodColor: '#000000',
    floodOpacity: 0.6
});