नक्शा प्रणाली
इंटरैक्टिव मैप्स, कोरोप्लेथ डेटा कलरिंग और एनिमेटेड खुलासाों के साथ आश्चर्यजनक भौगोलिक दृश्यता बनाएं।.
[विश्व मानचित्र प्राकृतिक पृथ्वी] (…/images/map-world-natural-earth.png)
अवलोकन
मानचित्र प्रणाली प्रदान करता है:
- ** वर्ल्ड एंड रीजनल मैप* - CDN (विश्व, संयुक्त राज्य अमेरिका, यूरोप, आदि) से पूर्व लोड नक्शे
- ** एकाधिक प्रोजेक्शन* — Mercator, प्राकृतिक पृथ्वी, Orthographic (globe), Albers, और अधिक
- रेगियन हाइलाइटिंग - हाइलाइट देश, राज्य या प्रांत
- *डाटा विज़ुअलाइज़ेशन - रंग पैमाने के साथ चौराहे के नक्शे
- *Markers & Labels - ब्याज के अंक जोड़ें
- ** व्यावसायिक गुणवत्ता* - जटिल देशों के लिए बहु बहु बहु बहुभुज समर्थन
एक मानचित्र लोड हो रहा है
टेम्पलेट्स से
शुरू करने का सबसे आसान तरीका एक मानचित्र टेम्पलेट का उपयोग कर रहा है:
-
- पैनल खोलें
- Maps श्रेणी का पता लगाएं
- “ग्लोबल विस्तार मानचित्र” या “यूएस डेटा विजुअलाइजेशन” जैसे टेम्पलेट चुनें
जेनरेटर पैनल से
- ** जेनरेटर* पैनल खोलें
- चुनें Map पृष्ठभूमि के प्रकार के रूप में
- एक मानचित्र चुनें (विश्व, संयुक्त राज्य अमेरिका, यूरोप, आदि)
- प्रोजेक्शन और स्टाइल को कॉन्फ़िगर करें
मानचित्र प्रकार
| नक्शा | विवरण | सर्वश्रेष्ठ |
|---|---|---|
| दुनिया | विश्व देशों (110m रिज़ॉल्यूशन) | त्वरित दुनिया के नक्शे |
| वर्ल्ड हाईरे | विश्व देशों (50 मीटर) | व्यावसायिक गुणवत्ता |
| यूएसए | अमेरिका | राज्य स्तरीय डेटा |
| संयुक्त राज्य अमेरिका | अमेरिकी काउंटी | काउंटी स्तर डेटा |
| यूरोप | यूरोपीय देश | यूरोपीय संघ के दृश्य |
| कनाडा | केवल कनाडा | कनाडा डेटा |
| अफ्रीका | अफ्रीकी देश | अफ्रीकी डेटा |
अनुमान
अपने विज़ुअलाइज़ेशन के लिए सही प्रोजेक्शन चुनें:
प्राकृतिक पृथ्वी (डिफ़ॉल्ट)
दुनिया के नक्शे के लिए सर्वश्रेष्ठ। संतुलित विरूपण, प्राकृतिक दिखता है।.
[प्राकृतिक पृथ्वी प्रोजेक्शन] (…/images/map-world-natural-earth.png)
मर्केटर
कोण, परिचित नज़र को संरक्षित करता है। नेविगेशन शैली के नक्शे के लिए अच्छा है।.
Orthographic (Globe)
पृथ्वी को 3 डी क्षेत्र के रूप में दिखाता है। केंद्रित क्षेत्र के दृष्टिकोण के लिए महान।.
[Orthographic ग्लोब] (…/images/map-orthographic-globe.png)
Albers USA
अमेरिकी मानचित्रों के लिए विशेष प्रक्षेपण जिसमें अलास्का और हवाई पुनर्गठन शामिल है।.
[USA Albers] (…/images/map-usa-albers.png)
अन्य प्रोजेक्शन
- रॉबिन्सन - समझौता प्रक्षेपण, विश्व मानचित्र के लिए अच्छा है
- Winkel Tripel - कम विरूपण विश्व प्रक्षेपण
- ** - मध्य अक्षांश क्षेत्रों के लिए अच्छा
हाइलाइटिंग क्षेत्र
एकल देश/राज्य
इसे चुनने के लिए किसी भी क्षेत्र पर क्लिक करें इसके बाद, गुण पैनल का उपयोग अपने रंग को बदलने के लिए करें।.
एकाधिक क्षेत्र
एकाधिक क्षेत्रों को उजागर करने के लिए API या टेम्पलेट्स का उपयोग करें:
// Highlight North American countries
app.mapSystem.highlightRegions(
['United States of America', 'Canada', 'Mexico'],
{ fillColor: '#22c55e', strokeColor: '#16a34a' }
);
Animated Reveals
टेम्पलेट्स क्षेत्र को अलग कर सकते हैं जो कहानी कहने के प्रभावों के लिए कंपित समय के साथ हाइलाइट करता है।.
[हाइलाइट क्षेत्र] (…/images/map-world-highlighted.png)
क्षेत्र ID प्रारूप
विभिन्न मानचित्र विभिन्न आईडी प्रारूपों का उपयोग करते हैं:
| नक्शा | आईडी प्रारूप | उदाहरण |
|---|---|---|
| विश्व मानचित्र | पूर्ण देश नाम | “संयुक्त राज्य अमेरिका”, “फ्रांस”, “जापान” |
| यूएसए नक्शा | राज्य नाम या कोड | “कैलिफोर्निया”, “सीए”, “टेक्सास”, “टीएक्स” |
डेटा विजुअलाइजेशन (Choropleth)
डेटा मूल्यों के आधार पर रंग क्षेत्र:
app.mapSystem.applyDataColors({
'California': 39538223,
'Texas': 29145505,
'Florida': 21538187
}, {
colorScale: 'blues',
showLegend: true,
legendTitle: 'Population'
});
रंग स्केल
| स्केल | रंग | सर्वश्रेष्ठ |
|---|---|---|
| ब्लूज़ | हल्का नीला | सामान्य डेटा |
| हरा | हल्का हरा | पर्यावरण डेटा |
| लाल | प्रकाश से अंधेरे लाल | चेतावनी / नकारात्मक डेटा |
| गर्मी | लाल | तीव्रता डेटा |
| बैंगनी | हल्के से गहरे बैंगनी | गुणात्मक डेटा |
मार्कर
विशिष्ट निर्देशांक पर बिंदु मार्कर जोड़ें:
app.mapSystem.addMarker({
lat: 37.7749,
lon: -122.4194,
label: 'San Francisco',
color: '#ef4444',
pulse: true // Animated pulse effect
});
गुणवत्ता सेटिंग
| गुणवत्ता | सरलीकरण | केस का उपयोग करें |
|---|---|---|
| ड्राफ्ट | उच्च | त्वरित पूर्वावलोकन |
| मानक | मध्यम | अधिकांश उपयोग |
| पेशेवर | कोई नहीं | अंतिम निर्यात, बहु बहु बहुभुज देशों |
** सभी क्षेत्र के हिस्सों को सही ढंग से प्रस्तुत करने के लिए जटिल आकार (रूस, फ्रांस, यूएसए) वाले देशों के लिए professional गुणवत्ता का उपयोग करें।.
बहुउद्देशीय देश
कुछ देशों में कई डिस्कनेक्टेड पार्ट्स शामिल हैं:
- ** रूस* - मुख्यभूमि + Kaliningrad + द्वीप
- *France - मुख्यभूमि + Corsica + विदेशी क्षेत्र
- यूएसए - मुख्यभूमि + Alaska + हवाई (विश्व मानचित्रों में)
- *इंडोनेशिया - हजारों द्वीप
- ** फिजी* - एकाधिक द्वीप
मैप सिस्टम स्वचालित रूप से इन देशों के लिए Paper.js कंपाउंडPath का उपयोग करता है जब गुणवत्ता professional पर सेट होती है।.
अन्तरक्रिया
Hover प्रभाव
सक्षम होवर हाइलाइटिंग:
app.mapSystem.loadMap('world', {
enableHover: true,
hoverFill: '#93c5fd'
});
घटनाओं पर क्लिक करें
क्षेत्र के लिए उत्तर क्लिक:
app.mapSystem.on('regionClick', (event) => {
console.log('Clicked:', event.regionId);
// Show info panel, highlight related regions, etc.
});
नक्शा टेम्पलेट्स
वैश्विक विस्तार मानचित्र
एनिमेटेड चरण आधारित हाइलाइटिंग वाले क्षेत्रों में व्यावसायिक विस्तार प्रदर्शित करता है।.
यूएस डेटा विजुअलाइजेशन
अमेरिका भर में डेटा प्रदर्शित करता है जिसमें कोरोप्लेथ कलरिंग होता है।.
कस्टम मानचित्र आयात
विस्तृत क्षेत्रीय मानचित्रों के लिए शामिल नहीं है, importCustomMap() का उपयोग करें:
// Load from GeoJSON
await app.mapSystem.importCustomMap(geoJsonData, {
projection: 'mercator',
idProperty: 'name'
});
डेटा स्रोत:
- प्राकृतिक पृथ्वी - सार्वजनिक डोमेन मानचित्र डेटा
- [GADM] (https://gadm.org) - विस्तृत प्रशासनिक सीमाएं
- Mapshaper - GeoJSON फ़ाइलों को सरलीकृत करें
टिप्स
- ** मल्टी-पॉलिगोन देशों के साथ पेशेवर निर्यात के लिए दुनिया HighRes* का उपयोग करें
- प्राकृतिक पृथ्वी प्रक्षेपण अधिकांश विश्व मानचित्रों के लिए सबसे अच्छा काम करता है
- Albers USA विशेष रूप से अमेरिका के नक्शे के लिए डिज़ाइन किया गया है
- Orthographic प्रस्तुतियों के लिए नाटकीय ग्लोब विचार बनाता है
- ** व्यावसायिक गुणवत्ता* जटिल देशों में आकार भ्रष्टाचार को रोकता है
कीबोर्ड शॉर्टकट
| शॉर्टकट | कार्रवाई |
|---|---|
| XQM | Toggle नक्शा उपकरण (जब उपलब्ध हो) |
| सभी क्षेत्रों का चयन करें |
नक्शा क्षेत्र एनिमेशन
समयरेखा-एकीकृत रंग परिवर्तन के साथ नक्शे के क्षेत्रों में परिवर्तन। समय के साथ डेटा परिवर्तन, वैश्विक विस्तार अनुक्रम दिखाने या डेटा दृश्यता को आकर्षक बनाने के लिए बिल्कुल सही।.
बुनियादी क्षेत्र एनिमेशन
कीफ़्रेम आधारित रंग संक्रमण के साथ विशिष्ट क्षेत्रों को अंकित करें:
// Load a world map first
await app.loadMap('world', {
projection: 'naturalEarth',
fillColor: '#e2e8f0'
});
// Animate specific regions
app.animateMapRegions({
duration: 5,
loop: true,
regions: {
'USA': [
{ time: 0, fillColor: '#ef4444' }, // Red at start
{ time: 2.5, fillColor: '#22c55e' }, // Green at midpoint
{ time: 5, fillColor: '#ef4444' } // Red at end (loops)
],
'France': [
{ time: 0, fillColor: '#3b82f6' }, // Blue at start
{ time: 5, fillColor: '#fbbf24' } // Yellow at end
]
}
});
वेव एनिमेशन
भौगोलिक स्थिति के आधार पर सभी क्षेत्रों में रंग की लहर बनाएँ:
app.animateMapWave({
duration: 10,
loop: true,
colors: ['#ef4444', '#fbbf24', '#22c55e', '#3b82f6'],
waveDirection: 'horizontal' // 'horizontal', 'vertical', 'radial'
});
समयरेखा एकीकरण
एनिमेटेड क्षेत्र टाइमलाइन यूआई के साथ एकीकृत होते हैं:
- एनिमेटेड क्षेत्र टाइमलाइन पैनल में दिखाई देते हैं
- रंग परिवर्तन का पूर्वावलोकन करने के लिए समय के माध्यम से स्क्रब
- समयरेखा नियंत्रण के साथ प्ले / रोकें एनिमेशन
- वीडियो या GIF के लिए एनिमेशन निर्यात करें
[मैप एनिमेशन के साथ टाइमलाइन] (…/images/timeline-with-keyframes.png)
बंद करना एनिमेशन
// Stop all region animations
app.stopMapAnimations();
// Stop specific regions
app.stopMapAnimations({ regions: ['USA', 'Canada'] });
// Stop but preserve current colors
app.stopMapAnimations({ resetColors: false });
एनिमेटेड क्षेत्र
const animated = app.getAnimatedMapRegions();
// Returns: [{ regionId, keyframes, duration, loop }, ...]
CSV निर्यात आयात
निर्यात और आयात क्षेत्र डेटा सहित रंग, हाइलाइट स्थिति, और डेटा संचालित दृश्यता के लिए चयन राज्य।.
निर्यात क्षेत्र डेटा
// Export all regions with current state
const csv = app.exportMapRegionDataCSV();
// Export with custom options
const csv = app.exportMapRegionDataCSV({
includeHighlighted: true, // Include highlight status column
includeSelected: true, // Include selection status column
includeColors: true // Include fill/stroke colors
});
// Download directly as CSV file
app.downloadMapRegionDataCSV('my-map-data.csv');
CSV प्रारूप:
regionId,name,highlighted,selected,fillColor,strokeColor
USA,United States of America,1,0,#22c55e,#16a34a
CAN,Canada,0,0,#e5e7eb,#9ca3af
FRA,France,1,1,#3b82f6,#2563eb
आयात क्षेत्र डेटा
CSV डेटा को अद्यतन करने के लिए आयात करें:
// Import from CSV text
app.importMapRegionDataCSV(csvText, {
applyColors: true, // Apply fill/stroke colors from CSV
applyHighlight: true, // Update highlight status
applySelection: true // Update selection status
});
प्रोग्रामेटिक चयन
// Select regions programmatically
app.selectMapRegions(['USA', 'Canada', 'Mexico']);
// Deselect regions
app.deselectMapRegions(['Mexico']);
// Get highlighted regions
const highlighted = app.getHighlightedMapRegions();
// Returns: ['USA', 'France', ...]
Workflow: स्प्रेडशीट आधारित मानचित्र संपादन
- एक मानचित्र लोड करें और कुछ क्षेत्रों को हाइलाइट करें
- CSV को निर्यात करें:
app.downloadMapRegionDataCSV('regions.csv') - एक्सेल / Google शीट्स में संपादित करें (बदलते रंग, सेट हाइलाइट = 1)
- वापस आयात करें:
app.importMapRegionDataCSV(updatedCsv)
इस कार्यप्रवाह के लिए आदर्श है:
- गैर तकनीकी उपयोगकर्ता संपादन मानचित्र डेटा
- कई क्षेत्रों में बल्क अपडेट
- डेटा पाइपलाइन एकीकरण
- संस्करण-नियंत्रित नक्शा विन्यास
GeoJSON निर्यात आयात
QGIS या Mapshaper जैसे बाहरी उपकरणों में संपादन के लिए GeoJSON के रूप में मानचित्र निर्यात करें, फिर अपने संशोधनों के साथ फिर से आयात करें।.
संशोधित मानचित्र निर्यात करें
वर्तमान रंगों और शैलियों के साथ मानचित्र निर्यात करें:
// Export as GeoJSON (includes current colors/styles)
const geoJson = app.exportMapGeoJSON();
// Download directly
app.downloadMapGeoJSON('my-styled-map.geojson');
मूल स्रोत निर्यात करें
उस सटीक GeoJSON को डाउनलोड करें जिसका उपयोग मानचित्र (अनोमोडिफाइड सीमाओं) को लोड करने के लिए किया गया था:
// Get original source data
const original = app.getOriginalMapGeoJSON();
// Download for external editing
app.downloadOriginalMapGeoJSON('world-source.geojson');
आयात कस्टम मानचित्र
अपने संपादित GeoJSON या बाहरी मानचित्र डेटा को आयात करें:
// Import from URL
await app.importCustomMap('https://example.com/my-map.geojson');
// Import from object
await app.importCustomMap(editedGeoJson, {
projection: 'naturalEarth'
});
Full Workflow: Edit → Re-import → Animate
-
लोड और निर्यात मूल मानचित्र:
await app.loadMap('world'); app.downloadOriginalMapGeoJSON('world-source.geojson'); -
** बाहरी उपकरणों में सीमा*
- [QGIS] (https://qgis.org) - फुल फीचर्ड GIS संपादक
- Mapshaper - ऑनलाइन सरलीकरण और संपादन
- geojson.io - त्वरित ऑनलाइन संपादक
-
** फिर से आयात* आपका संपादित मानचित्र:
await app.importCustomMap(editedGeoJson, { projection: 'naturalEarth' }); -
** अपने कस्टम मानचित्र
app.animateMapRegions({ duration: 5, regions: { 'MyRegion': [{ time: 0, fillColor: '#ef4444' }, ...] } });
नक्शा स्रोत जानकारी
वर्तमान में लोड किए गए मानचित्र के बारे में जानकारी प्राप्त करें:
const info = app.getMapSourceInfo();
// {
// source: 'world',
// projection: 'naturalEarth',
// quality: 'standard',
// regionCount: 177,
// hasOriginalGeoJSON: true,
// isCustomImport: false
// }
बाह्य संसाधन
मानचित्र डेटा स्रोत
| स्रोत | विवरण | सर्वश्रेष्ठ |
|---|---|---|
| प्राकृतिक पृथ्वी | एकाधिक पैमाने पर मुफ्त सार्वजनिक डोमेन मानचित्र डेटा | विश्व मानचित्र, त्वरित परियोजनाएं |
| [GADM] (https://gadm.org) | उच्च गुणवत्ता वाली प्रशासनिक सीमाएं | देश उपखंड, विस्तृत क्षेत्र |
| OpenStreetMap | सामुदायिक रखरखाव, अत्यधिक विस्तृत | शहर के स्तर के डेटा, सड़कों, इमारतों |
| [US Census TIGER] (https://www.census.gov/geographies/mapping-files/time-series/geo/tiger-line-file.html) | अमेरिकी सीमा | अमेरिकी राज्यों, काउंटियों, tracts |
| [Eurostat] (https://ec.europa.eu/eurostat/web/gisco/geodata/reference-data/administrative-units-statistical-units) | आधिकारिक यूरोपीय संघ की सीमाएं | यूरोपीय देशों और क्षेत्रों |
रूपांतरण और संपादन उपकरण
| उपकरण | विवरण | लिंक |
|---|---|---|
| मानचित्र | मानचित्र को सरल बनाने और परिवर्तित करने के लिए ऑनलाइन उपकरण | mapshaper.org |
| geojson.io | त्वरित ऑनलाइन GeoJSON संपादक | geojson.io |
| QGIS | पूर्ण चित्रित डेस्कटॉप जीआईएस (मुक्त) | [qgis.org] (https://qgis.org) |
| ogr2ogr | कमांड लाइन प्रारूप कनवर्टर | [GDAL] (https://gdal.org) का हिस्सा |
प्रारूप रूपांतरण वर्कफ़्लो
Shapefile → GeoJSON (Mapshaper का उपयोग कर):
- [mapshaper.org] (https://mapshaper.org)
- अपने
.shpफ़ाइल को खींचें और छोड़ दें (.dbfऔर.prjफ़ाइलों के साथ) - फ़ाइल आकार को कम करने के लिए ** सरलीकृत करें (वेब के लिए 10-20% का उपयोग करें)
- क्लिक करें ** निर्यात* → चुनें GeoJSON*
app.importCustomMap()के साथ PinePaper में आयात करें
TopoJSON → GeoJSON:
PinePaper में आयात होने पर TopoJSON फ़ाइलों को स्वचालित रूप से परिवर्तित किया जाता है।.
फाइल साइज टिप्स
| मूल आकार | कार्रवाई |
|---|---|
| 1 MB | सीधे उपयोग करें |
| 1-5 MB | Mapshaper में 50% तक की छूट |
| 5-20 MB | 10-20% |
| 20 MB | एक छोटे क्षेत्र या उच्च सरलीकरण का उपयोग करके विचार करें |
API संदर्भ
प्रोग्रामेटिक मानचित्र नियंत्रण के लिए, [मैप सिस्टम API प्रलेखन] (/api/features/maps) देखें।.