|
@ -3,16 +3,22 @@ import * as FileSystem from "expo-file-system"; |
|
|
|
|
|
|
|
|
const HTML_FILE_PATH = require(`./Map.html`); |
|
|
const HTML_FILE_PATH = require(`./Map.html`); |
|
|
|
|
|
|
|
|
const loadHTMLFile = async () => { |
|
|
|
|
|
|
|
|
const loadLocalAsset = async (asset) => { |
|
|
try { |
|
|
try { |
|
|
const [{ localUri }] = await Asset.loadAsync(HTML_FILE_PATH); |
|
|
|
|
|
|
|
|
const [{ localUri }] = await Asset.loadAsync(asset); |
|
|
const fileString = await FileSystem.readAsStringAsync(localUri); |
|
|
const fileString = await FileSystem.readAsStringAsync(localUri); |
|
|
|
|
|
|
|
|
return fileString; |
|
|
return fileString; |
|
|
|
|
|
|
|
|
} catch (error) { |
|
|
} catch (error) { |
|
|
console.warn(error); |
|
|
console.warn(error); |
|
|
console.warn("Unable to resolve index file"); |
|
|
|
|
|
|
|
|
// console.warn("Unable to resolve index file");
|
|
|
} |
|
|
} |
|
|
|
|
|
return "asidaosid"; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
const loadHTMLFile = async () => { |
|
|
|
|
|
return loadLocalAsset(HTML_FILE_PATH); |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
function goToRegion(mapRef, { lat, long, zoom }) { |
|
|
function goToRegion(mapRef, { lat, long, zoom }) { |
|
@ -43,14 +49,19 @@ function handleEvent(event) { |
|
|
return code_to_function[payload.code](payload); |
|
|
return code_to_function[payload.code](payload); |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
function insertMarker(mapRef, ID, cords, icon) { |
|
|
|
|
|
console.log(ID); |
|
|
|
|
|
mapRef.injectJavaScript( |
|
|
|
|
|
`
|
|
|
|
|
|
|
|
|
async function insertMarker(mapRef, ID, cords, icon) { |
|
|
|
|
|
var iconSvg = icon; |
|
|
|
|
|
if (typeof icon !== 'string' && !(icon instanceof String)) { |
|
|
|
|
|
iconSvg = await loadLocalAsset(icon); |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
console.log(String(iconSvg)); |
|
|
|
|
|
|
|
|
|
|
|
mapRef.injectJavaScript(`
|
|
|
var customIcon = L.divIcon({ |
|
|
var customIcon = L.divIcon({ |
|
|
className: 'marker-class', |
|
|
className: 'marker-class', |
|
|
html: '` + icon + `', |
|
|
|
|
|
iconSize: 10 |
|
|
|
|
|
|
|
|
html: ${iconSvg} , |
|
|
|
|
|
iconSize: 100 |
|
|
}); |
|
|
}); |
|
|
|
|
|
|
|
|
// Check if there is no other marker with same ID already in map
|
|
|
// Check if there is no other marker with same ID already in map
|
|
@ -61,8 +72,7 @@ function insertMarker(mapRef, ID, cords, icon) { |
|
|
// Add marker to map and bing callback event to its function
|
|
|
// Add marker to map and bing callback event to its function
|
|
|
markers[${ID}].addTo(map).on('click', onPopupClick); |
|
|
markers[${ID}].addTo(map).on('click', onPopupClick); |
|
|
} |
|
|
} |
|
|
`
|
|
|
|
|
|
); |
|
|
|
|
|
|
|
|
`);
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
export { loadHTMLFile, handleEvent, insertMarker, goToRegion }; |
|
|
export { loadHTMLFile, handleEvent, insertMarker, goToRegion }; |