2013-04-15 2 views
5

से स्वतंत्र आइकन रंग/यूआरएल सेट करें, मैं मार्करक्स्टेररप्लस के माध्यम से कुछ सौ हजार अंक प्लॉट कर रहा हूं, और मैं कुछ बाहरी संपत्ति ( पर आधारित क्लस्टर आइकन (रंग) के समूह सेट करना चाहता हूं मार्कर प्रतिनिधित्व)।मार्करक्लस्टररप्लस: आकार

एकमात्र तरीका यह है कि मैं ऐसा करने के लिए सोच सकता हूं कि एकाधिक मार्करक्लस्टर ऑब्जेक्ट्स बनाकर और options ऑब्जेक्ट में गुजर रहा है, लेकिन मुझे लगता है कि मैं ऐसा करने में एक बड़ा प्रदर्शन करूंगा। क्या कोई बेहतर तरीका है?

Marker Clusterer Plus with differently sized icons scaled to fit.

ऊपर छवि देखते हुए, मैं 139, 24, और 5 पीले होने के लिए और 213, 25, 30, और 2 लाल होना चाहते हैं; और यदि संभव हो तो, setOptions के माध्यम से उनकी शैली/विकल्प अपडेट:
mc.group[0].setOptions({"url": imgPath +lookupThreshold(severity)+ '.svg' });
mc.group[1].setOptions({"url": imgPath +lookupThreshold(severity)+ '.svg' });

पी.एस. अगर कोई रुचि है, मैं lib बदलाव तो गुच्छा आइकन एक svg छवि की आपूर्ति और चौड़ाई & विकल्पों में ऊंचाई में वृद्धि से इसके आकार को मापता है † वस्तु:

var mcOptions = { 
    "styles": [{ 
    "height": 19, 
    "url": img/map/clusters/", 
    "width": 19 
    },{ 
    "height": 24, 
    "url": img/map/clusters/", 
    "width": 24 
    }, {…}] 
}; 
for (var s = mcOptions.styles.length-1; s >= 0; s--) 
{ mcOptions.styles[s].url += lookupThreshold(severity) + '.svg'; } 
// lookupThreshold switches severity and returns a string: red, orange, … 

फिर markerclusterer.js के लिए निम्न कहा:

line 275: this.backgroundSize_ = style.backgroundSize || "contain"; 
line 300: style.push('background-size:' + this.backgroundSize_ + ';'); 

Ffx 19.0.2 में वर्क्स, क्रोम 26.x, क्रोम कैनरी 28.x, सफारी 6.0.2 †, आईई 9.0.8 (लेकिन ओपेरा 12.15)।

EDIT ऐसा लगता है कि मार्करक्लस्टरर के कई उदाहरण बनाने से प्रदर्शन में बहुत अधिक प्रदर्शन नहीं हुआ है; हालांकि, ऐसा प्रतीत होता है कि एमसी को पास किए गए गुण/विकल्प वस्तु साझा की गई एमसी के उदाहरणों को साझा करती है।

हल मैं opt_options क्लोन करने के लिए लाइन 665 के पास MarkerClustererPlus पुस्तकालय को संशोधित करने के लिए किया था (lib एक संदर्भ है, जो की वजह से सभी पिछले opt_options नवीनतम/पिछले एक पारित कर दिया साथ ओवरराइट किया जाएगा करने के लिए उपयोग कर रहा था)।

+0

क्या आपने इस लिंक को चेक किया है? http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markerclusterer/examples/advanced_example.html – Fabi

+0

@ फ़बी, हां। क्लस्टर अलग क्लस्टर हैं क्योंकि वे अलग-अलग आकार हैं। मैं चाहता हूं कि समूहों के किसी विशेष समूह के सभी आकार एक ही रंग के हों (लेकिन आकार में भिन्न हो); विभिन्न समूहों में अलग-अलग रंग होना चाहिए। – jacob

+0

अब के लिए मैं आपके पास जो कुछ भी है उसके अलावा मैं एक अलग समाधान नहीं देख सकता - कई उदाहरण हैं क्योंकि वे अलग-अलग समूह हैं। – Fabi

उत्तर

2

तो यह पता चला है मुसीबत MarkerClustererPlus lib खुद से आ रहा था: एक नई प्रतिलिपि के बजाय,

656: function MarkerClusterer(map, opt_markers, opt_options) { 
… 
665: opt_options = opt_options || {}; 

लाइन मौजूदा ऑब्जेक्ट में एक संदर्भ पैदा करता है। मैं का उपयोग से नहीं कर सका क्योंकि यह गहरी प्रतिलिपि नहीं बनाता है (और यह केवल एक ऑब्जेक्ट का प्रोटोटाइप बढ़ाता है)।

function deepCopy(obj) { 
    this.cloneArr = function (arr) { 
    var newArr = []; 
    for (var i = arr.length-1; i >= 0; i--) newArr[i] = this.evalObj(arr[i]); 
    return newArr; 
    }; 
    this.cloneObj = function(obj) { 
    var newObj = {}; 
    for (var prop in obj) newObj[prop] = this.evalObj(obj[prop]); 
    return newObj; 
    }; 
    this.evalObj = function(obj) { 
    switch (typeof obj) { 
     case 'object': 
     if (Array.isArray(obj)) return this.cloneArr(obj); 
     if (obj instanceof Date === false) return this.cloneObj(obj); 
     // pass thru dates, strings, numbers, booleans, and functions 
     default: return obj; // primitive 
    } 
    }; 
    return this.evalObj(obj); 
} 

मैं:

तो, मैं अपने खुद के गहरे प्रतिलिपि समारोह (jsfiddle) है, जो मैं विश्व स्तर पर उपलब्ध (बजाय यह दोनों सरणी के प्रोटोटाइप के लिए जोड़ और वस्तु) बनाया लिखा था फिर MarkerClustererPlus बदल दिया।js निम्न के:

656: function MarkerClusterer(map, opt_markers, opt_optionsG) { 
… 
665: var opt_options = deepCopy(opt_optionsG) || {}; 

मैं (5000 मार्करों, कुल 25000 के साथ प्रत्येक) MarkerClustererPlus के 5 उदाहरणों होने का परीक्षण किया है, और कोई decernable प्रदर्शन प्रभाव एक भी एम सी + उदाहरण होने की तुलना में था।

Screenshot of multiple instances of MarkerClustererPlus

+0

बहुत उपयोगी! फ़ंक्शन गहरी कॉपी जोड़ने के लिए कहां? और रंग बदलने के लिए एचटीएमएल में आपका विस्तृत कोड कैसा है? धन्यवाद – Orz

+0

मेरे उत्तर के अनुसार, मैंने इसे "वैश्विक रूप से" ('विंडो' से जुड़ा) रखा है। मार्करों का रंग 'यूआरएल' संपत्ति में आपूर्ति किए गए एसवीजी द्वारा नियंत्रित होता है। – jacob

संबंधित मुद्दे