Манипуляции с svg картой внутри html canvas - PullRequest
Новая
       42

Манипуляции с svg картой внутри html canvas

0 голосов
/ 04 мая 2020

У меня есть карта мира (со странами и штатами / провинциями) в SVG и файл CSV с данными о городах по всему миру, каждый в следующем формате: 

"Tokyo","Tokyo","35.6850","139.7514","Japan","JP","JPN","Tōkyō","primary","35676000","1392685764"

Если у меня есть холст на моей html странице, такой как: 

<canvas id="map_compras" width="640" height="480"></canvas>

Я хочу:

  • Нарисуйте эту карту SVG внутри этого холста, позволяя изменять масштаб от мировоззрения до состояния / представление провинции, центрированное по положению указателя мыши;
  • для каждого уровня масштабирования, вычисление диапазона координат GPS (на основе широты / долготы краев) и получение с сервера списка городов, которые будут отображается на карте (только в виде круга, на основе координат `" 35.6850 "," 139.7514 ");
  • , когда указатель мыши перемещается по кругу, представляющему город, показать заметку с данными, полученными из сервер об этом городе.

данные с сервера будут извлекаться с использованием XMLHttpRequest из контроллера Spring следующим образом: 

  @RequestMapping(value="/list.json", method=RequestMethod.GET)
  @ResponseBody
  public String list() throws JsonProcessingException {
    ObjectMapper mapper = new ObjectMapper();
    return mapper.writeValueAsString(...);
  }

Любой может дать мне подсказку: как это сделать?

...