Closed utoshkentov closed 2 years ago
You can try something like this:
import React, { useRef } from "react";
import ReactDOM from "react-dom";
import { YMaps, Map, RulerControl } from "react-yandex-maps";
import "./styles.css";
function App() {
// you need to store map ref to set ruler coordinates
const map = useRef(null);
return (
<div className="App">
<YMaps>
<Map
defaultState={{
center: [55.751574, 37.573856],
zoom: 9
}}
instanceRef={map}
>
<RulerControl
onLoad={(e) => {
// Run this function when ruler will be ready
// This is init ruler state https://yandex.ru/dev/maps/jsapi/doc/2.1/ref/reference/behavior.Ruler.html#method_detail__setState
const state =
"37.57660258,55.69576899~-0.01098633,0.09605884~0.12634277,0.00309472";
if (map.current) {
map.current.behaviors.get("ruler").setState(state);
}
}}
options={{ float: "right" }}
/>
</Map>
</YMaps>
</div>
);
}
const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);
Parser from array object to string
export const parser = () => {
const result = [];
console.log(mapsLats.length, 'length');
for (let i = 0; i < mapsLats.length; i++) {
const next = mapsLats[i + 1];
const current = mapsLats[i];
if (next) {
result.push(${next.lng - current.lng},${next.lat - current.lat}
);
}
console.log(result, 'result');
}
return ${mapsLats[0].lng},${mapsLats[0].lat}~${result.join('~')}
;
};
example list of coordinates
How can I put default locations with latatiude and longitudes list as a default array?