Друзья, использую данный скрипт для создания интерактивных планировок.
www.outsharked.com/imagemapster/default.aspx?docs.html
Планировок очень много и поэтому появилась возможность оптимизировать код в цикл.
сейчас он такого вида
var image = $('#vegetables-1');
image.mapster({
fillOpacity: 0.5,
fillColor: "ffb6dc",
stroke: false,
strokeColor: "red",
strokeOpacity: 0.7,
strokeWidth: 4,
singleSelect: false,
mapKey: 'name',
listKey: 'name',
areas: [{
key: "sec1kv1",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
}, {
key: "sec1kv2",
selected: true,
isDeselectable: false,
fillColor: "ffec78"
}, {
key: "sec1kv3",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
}, {
key: "sec1kv4",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
},
{
key: "sec1kv5",
selected: true,
isDeselectable: false,
fillColor: "ffec78"
},
{
key: "sec1kv6",
selected: true,
isDeselectable: false,
fillColor: "ffb6dc"
}]
});
var image = $('#vegetables-2');
image.mapster({
fillOpacity: 0.5,
fillColor: "ffb6dc",
stroke: false,
strokeColor: "red",
strokeOpacity: 0.7,
strokeWidth: 4,
singleSelect: false,
mapKey: 'name',
listKey: 'name',
areas: [{
key: "sec2kv1",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
}, {
key: "sec2kv2",
selected: true,
isDeselectable: false,
fillColor: "ffec78"
}, {
key: "sec2kv3",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
}, {
key: "sec2kv4",
selected: true,
isDeselectable: false,
fillColor: "c4ff92"
},
{
key: "sec2kv5",
selected: true,
isDeselectable: false,
fillColor: "ffec78"
},
{
key: "sec2kv6",
selected: true,
isDeselectable: false,
fillColor: "ffb6dc"
}]
});
общие параметры у всех планировок одинаковые. меняются только кол-во квартир и цвет их который key
